当前位置:首页 > 知识库 > 正文内容

修改百度代码为延迟加载,不影响网站加载速度。

1年前 (2023-08-18)知识库441

有时候百度网站统计代码会影响我们的网站加载速度,尤其是当服务器或虚拟主机带宽小的情况下更是苦不堪言。


所以今天对百度网站统计代码下手了,以下是效果截图。

123.png

首先创建了一个名为loadBaiduStatistics的函数,该函数用于加载百度统计代码。


在函数中,创建了一个新的<script>元素,并将其src属性设置为百度统计代码的URL。


接下来获取页面中的第一个<script>元素,并将新创建的<script>元素插入到其之前,以确保百度统计代码在页面加载完毕后加载。


然后使用条件语句来检测浏览器是否支持addEventListener方法。如果支持,则将loadBaiduStatistics函数添加为load事件的监听器。


如果浏览器不支持addEventListener方法,再次检测是否支持attachEvent方法。如果支持,则将loadBaiduStatistics函数添加为onload事件的监听器。


如果浏览器都不支持上述两种方法,将loadBaiduStatistics函数赋值给window.onload属性。


这样,当页面加载完毕后,会触发相应的事件或属性,从而延迟加载百度统计代码。


这是完整的第一段代码:

<script>
function loadBaiduStatistics() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?Your Baidu statistics code";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
}

if (window.addEventListener) {
  window.addEventListener("load", loadBaiduStatistics, false);
} else if (window.attachEvent) {
  window.attachEvent("onload", loadBaiduStatistics);
} else {
  window.onload = loadBaiduStatistics;
}
</script>

这段代码在页面加载完成后,通过监听window.onload事件来触发加载百度统计的脚本。这意味着当页面的所有资源(包括图片、样式表等)都加载完成后,才会执行加载统计脚本的操作。这样可以确保页面的所有内容都已经完全加载,但可能会延迟统计脚本的加载。


这是完整的第二段代码:

<script>
function loadBaiduStatistics() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?Your Baidu statistics code";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
}

function deferBaiduStatistics() {
  if (window.addEventListener) {
    window.addEventListener("load", loadBaiduStatistics, false);
  } else if (window.attachEvent) {
    window.attachEvent("onload", loadBaiduStatistics);
  } else {
    window.onload = loadBaiduStatistics;
  }
}

if (document.readyState === "complete") {
  loadBaiduStatistics();
} else {
  deferBaiduStatistics();
}
</script>

这段代码在页面加载完成后,首先判断document.readyState的值。如果为"complete",则直接加载百度统计的脚本;如果不为"complete",则通过deferBaiduStatistics函数来延迟加载百度统计的脚本。这样可以在页面加载完毕时立即加载统计脚本,但可能会在页面内容完全加载前执行统计脚本。


这是完整的第三段代码(百度官方代码):

<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?Your Baidu statistics code";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

这段代码是直接将百度统计的脚本插入到页面中,无需等待页面加载完成。这样可以尽早加载统计脚本,但可能会在页面内容完全加载前执行统计脚本。


选择哪一段代码取决于具体的需求和网页加载的情况。如果希望在页面内容完全加载后再加载统计脚本,可以选择第一段或第二段代码;如果希望尽早加载统计脚本,可以选择第三段代码。


修改以上代码中的Your Baidu statistics code为你的百度统计代码即可。

扫描二维码推送至手机访问。

版权声明:本文由康斯网发布,如需转载请注明出处。

本文链接:https://www.ksnet.vip/knowledge/23.html

“修改百度代码为延迟加载,不影响网站加载速度。” 的相关文章

前端静态资源CDN库推荐

前端静态资源CDN库推荐

静态资源 CDN 公共库是指一些服务商把我们常用的 JavaScript 库放在网上,方便开发者直接用,并且还提供 CDN 加速。这样可以加快用户访问这些资源的速度,同时也可以减少自己服务器的流量消耗。目前国内的 CDN 主要同步的资源来自于 https://cdnjs.com/也就是说,如果你成功...

网站图片使用懒加载用于提高网站的访问速度

网站图片使用懒加载用于提高网站的访问速度

代码使用方法也及其简单默认的图片在代码中输出的格式是<img src="" alt="">只需要将代码中的src=""修改为data-src=""即可。使用的时候多尝试,在banner或者是Logo出尽量不要...

如何优化企业网站加载速度和节省CDN流量

如何优化企业网站加载速度和节省CDN流量

随着网站规模和内容的不断增长,许多企业面临着一个共同的问题:网站加载速度慢,同时还需要节省CDN流量以提高用户体验。这种情况下,优化企业网站的加载速度和节省CDN流量成为了一项重要的任务。需要解决服务器原因导致的网站加载慢的问题。为了提高网站的响应速度,考虑使用高性能服务器或者云服务。可以确保网站能...

火车采集器常用正则表达式(高铁采集器正则表达式)

火车采集器常用正则表达式(高铁采集器正则表达式)

匹配一个或者多个连续的空格\s+匹配标题中所有的标点符号[^\w\s\。\?\!\.\?\!]匹配所有带&字面字符,[a-z]匹配大小写&[a-z]+;匹配手机号码带国际区号的、不带国际区号的、带"-"分隔符的等等(\+?86)?1[3-9]\d{1,2}-?\d...

各大银行的SWIFT/BIC代码

各大银行的SWIFT/BIC代码

SWIFT/BIC代码是由Society for Worldwide Interbank Financial Telecommunication(全球银行间金融电信协会,简称SWIFT)定义的一种标准格式的银行标识符代码(Bank Identifier Codes,简称BIC)。SWIFT代码也被称...

腾讯,搜狐,百度,IP地址查询服务的API接口

腾讯,搜狐,百度,IP地址查询服务的API接口

1. 腾讯 IP 地址查询 API:   - 接口地址: https://apis.map.qq.com/ws/location/v1/ip   - 示例请求: https://apis.map.qq.com/ws/location/v1/ip?ip=YOUR...