JS延迟加载加快页面打开速度示例代码_javascript技巧

第一,JS延迟加载

代码如下:

复制代码 代码如下:

<script language="JavaScript" src="" id="my"></script>
<script language="JavaScript">
setTimeout("document.getElementById('my').src='include/...文件...php'; ",3000);//延时3秒
</script>

第二,JS最后加载

在需要插入JS的地方插入以下代码:

<SPAN id=L4EVER>LOADING...</SPAN>

当然,那个LOADING…你可以换成自己喜欢的小图片.看起来很有AJAX效果呢.

然后在页面最底端插入:

复制代码 代码如下:

<SPAN class=spanclass id=AD_L4EVER>
你的JS代码在这里!</SPAN>
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML="";</script>

第三,JS最后加载

想要显示广告的位置
<div id="guangg1"></div>

想要显示的广告内容

复制代码 代码如下:

<div id="ggad1" style="display:none">
<script language="javascript" src="/include/.......js"></script>
</div>

判断要显示的广告位置是否存在

复制代码 代码如下:

<script language="javascript">
function chkdiv(divid){
var chkid=document.getElementById(divid);
if(chkid != null)
{return true; }
else
{return false; }
} 最后就是显示广告了
if (chkdiv('guangg1')) {
document.getElementById('guangg1').innerHTML= document.getElementById('ggad1').innerHTML;
document.getElementById('ggad1').innerHTML="";
}
</script>

setTimeout用法

setTimeout的标准语法是: setTimeout(表达式,时间(毫秒)) 两个参数.

在这里着重记下第一个参数是一个 function时的调用,假设是一个函数.

1.函数无参:

function alertV(){ alert("000"); }

当第一个参数不加引号("" 或 '')时,延迟一秒:
setTimeout(alertV,1000);

当第一个参数加上又引号时,延迟一秒:
setTimeout("alertV()",1000);

2. 函数有参:

function alertV(event){ alert("keyCode="+event.keyCode); }

此时应设置成:
setTimeout(function(){alertV(event);},1000); 不然会提示参数未定义.

时间: 2024-09-19 09:19:29

JS延迟加载加快页面打开速度示例代码_javascript技巧的相关文章

JS延迟加载加快页面打开速度

 使用JS延迟加载可以加快打开速度,下面有几个不错的示例,感兴趣的朋友可以参考下 第一,JS延迟加载    代码如下:  代码如下: <script language="JavaScript" src="" id="my"></script>  <script language="JavaScript">  setTimeout("document.getElementById('

用innerhtml提高页面打开速度的方法_javascript技巧

查看源代码,可以发现,页首的登陆代码位置,只有一行 复制代码 代码如下: <div id="headtop"></div> 而flash幻灯的位置,也只有一行 复制代码 代码如下: <div id="index_slide"></div> 对于这种需要耗时的代码,最好是放在页面最后面加载,然后用innerhtml的方法加载到对应位置,达到加快页面打开速度的目的. 复制代码 代码如下: $("#headtop&

js禁止页面复制功能禁用页面右键菜单示例代码_javascript技巧

<body oncontextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制. js代码禁用复制功能: 复制代码 代码如下: <script type="text/javascript"> document.body.onselectstart=document.body.oncontextmenu=function(){ return false;} </script> 注意这段代码必须放在

js 事件截取enter按键页面提交事件示例代码_javascript技巧

假如你在一个文本框中按enter事件是让他执行一个js函数,但是不想提交表单,可以这样做: function ysearch() //年文本框回车键后重新加载DataWindow{    validateInputText('yyyy');//想做的第一个js函数    if(event.keyCode==13)    {        changeym();//想做的第二个js函数,做完后把event给清空        event.returnValue=false;//把event事件给截

js选择并转移导航菜单示例代码_javascript技巧

实现html界面 <!DOCTYPE html> <html> <head> <title>Select and Go Navigation</title> <script src="script01.js"></script> <link rel="stylesheet" href="script01.css" rel="external nof

js确认删除对话框效果的示例代码_javascript技巧

效果如下: css文件delcss.css 代码如下: 复制代码 代码如下: *{ margin:0; padding:0;}#div1{ width:300px; height:100px; border-radius:10px; background:#f60; box-shadow:5px 5px 10px #ccc; position:absolute; left:50%; margin-left:-150px; z-index:2; opacity:0; filter:alpha(op

js右下角弹出提示框示例代码_javascript技巧

本文实例讲解了网页右下角弹出广告信息框实例代码,分享给大家供大家参考,具体内容如下 效果图: 具体代码: <!DOCTYPE html> <html> <head> <meta charset="gb2312"> <title>网页右下角的信息框</title> </head> <style type="text/css"> #winpop { width:200px;

JS实现一键回顶功能示例代码_javascript技巧

1.基础准备: scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置. scroll top offset 指的是滚动条相对于其顶部的偏移. 如果该方法未设置参数,则返回以像素计的相对滚动条顶部的偏移. 语法 $(selector).scrollTop(offset) 2. toggleClass() 对设置或移除被选元素的一个或多个类进行切换. 例如对设置和移除所有 <p> 元素的 "main" 类进行切换: 复制代码 代码如下: $("button

JavaScript禁止页面操作的示例代码_javascript技巧

单的JS禁止页面右键菜单--避免网站信息被盗用 复制代码 代码如下: <script type="text/javascript">  function block(oEvent){   if(window.event)    oEvent=window.event;   if(oEvent.button==2)    alert("鼠标右键不可用");  }  document.onmousedown=block;</script> 网页上