在HTML中设置新预渲染或预取的正确方法是什么? [英] What's the right method to set a new prerender or prefetch in HTML?

查看:262
本文介绍了在HTML中设置新预渲染或预取的正确方法是什么?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

 <!DOCTYPE html> 
< meta charset =utf-8>
< title> HTML文件< / title>
< link rel =prefetchhref =https://www.apple.com/>
< link rel =prerenderhref =https://www.apple.com/>
< script>
document.addEventListener('click',function(){
//在Chrome上预呈现https://www.apple.com/ipad
// ...

//在Firefox上预取https://www.apple.com/ipad
// ...
},false);
< / script>

当页面打开时, https://www.apple.com/ 是在不同的浏览器上预渲染和预取的。当单击文档时,我希望预渲染和预取另一个页面, https://www.apple.com/ipad

看来我们有两种方法可供选择。我们可以替换当前2 link 元素中的URL。或者我们可以在 head 元素中插入2个新的 link 元素。



什么是在HTML中设置新预渲染的正确方法?



在HTML中设置新预取的正确方法是什么?



我尝试从 link 元素的URL > https://www.apple.com/ https://www.apple.com / ipad 。我开启了Chrome的任务管理器,发现 https://www.apple.com/ipad wasn'预先准备好了唯一的分段页面仍然是 https://www.apple.com/ 。所以看起来这种方法是行不通的?

解决方案

< link rel =" prefetch" > 实际上是

< link rel =" prerender">< / rel =nofollow noreferrer> HTML 5 spec 。 code>似乎是 Google自己动手



贾斯汀不正确。你需要预取和预渲染(或至少一个polyfill将输出两个)作为 FF支持预取 Chrome支持预渲染


<!DOCTYPE html>
<meta charset="utf-8">
<title>An HTML Document</title>
<link rel="prefetch" href="https://www.apple.com/">
<link rel="prerender" href="https://www.apple.com/">
<script>
    document.addEventListener('click', function () {
        // Prerendering https://www.apple.com/ipad on Chrome.
        // ...

        // Prefetching https://www.apple.com/ipad on Firefox.
        // ...
    }, false);
</script>

When the page is opened, https://www.apple.com/ is prerendered and prefetched on different browsers. When the document is clicked, I hope to prerender and prefetch another page, https://www.apple.com/ipad.

It appears we have 2 methods to choose. We can either replace the URLs in current 2 link elements. Or we can insert 2 new link elements into head element.

What's the right method to set a new prerender in HTML?

What's the right method to set a new prefetch in HTML?

I tried to replace prerender link element's URL from https://www.apple.com/ to https://www.apple.com/ipad on Chrome. I turned Chrome's Task manager on and found that https://www.apple.com/ipad wasn't prerednered. The only prerendered page is still https://www.apple.com/. So it appears this method doesn't work?

解决方案

<link rel="prefetch"> is actually part of the HTML 5 spec.

<link rel="prerender"> appears to be Google doing their own thing.

Justin is incorrect. You do need both prefetch and prerender (or at least a polyfill that will output both) as FF supports prefetch and Chrome supports prerender.

这篇关于在HTML中设置新预渲染或预取的正确方法是什么?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆