js预解析及特效
预解析:
// 作用域:
// 域:空间、范围、区域……
// 作用:读、写 script 全局变量、全局函数
自上而下 函数
由里到外 {} 浏览器:
“JS解析器”
1)“找一些东西” :var function 参数 a = ...
所有的变量,在正式运行代码之前,都提前赋了一个值:未定义 fn1 = function fn1(){ alert(2); }
所有的函数,在正式运行代码之前,都是赋整个函数块 JS 的预解析 遇到重名的:只留一个
变量和函数重名了,就只留下函数 2)逐行解读代码:
表达式:= + - * / % ++ -- ! 参数…… 表达式可以修改预解析的值! if{} for{} dowhile{} 不是作用域
3D转示:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3Dzhuanshi</title>
<script>
window.onload=function ()
{ //拖着虚拟的点转动,虚拟点不设置y点,是因为不想让在Y轴上还运动
var x=lastX=0;
var iSpeed=0;
var timer=null;
var oImg=document.getElementById("img1");
var aImg=document.getElementsByTagName('img');
var oLastImg=oImg;//标志显示当前的img
//图片优化性能
for(var i=0; i<77; i++) {
//(fn(param))(sparam);
(function(oNewImg) {
var oImgs=new Image();
//var oNewImg=document.createElement('img');
oImgs.onload=function() {
oNewImg.src=this.src;
};
oImgs.src='img/miaov ('+i+').jpg';
oNewImg.style.display='none';
document.body.appendChild(oNewImg);
})(document.createElement('img'));
} document.onmousedown=function(ev) {
clearInterval(timer);
var oEvent=ev||event;
var disX=oEvent.clientX-x;
document.onmousemove=function(ev) {
oEvent=ev||event;
x=oEvent.clientX-disX;
move();
iSpeed=x-lastX;
lastX=x;
//oImg.src='img/miaov ('+l+').jpg';
return false;//解决ie的默认事件
};
document.onmouseup=function() {
document.onmousemove=null;
document.onmouseup=null;
timer=setInterval(function(){
x+=iSpeed;
move();
}, 30);
}; function move() {
if(iSpeed>0)
iSpeed--;
else
iSpeed++;
var l=parseInt(-x/10);
//拖动10个像素,图片旋转
if(iSpeed==0) {
clearInterval(timer);
}
if(l>0)
l=l%77;
else
l=l+Math.floor(l/77)*77*(-1);
//图片优化性能
if(oLastImg!=aImg[l]) {
oLastImg.style.display='none';
aImg[l].style.display='block';
oLastImg=aImg[l];
}
}
return false;//禁止默认事件ff/chrome支持,,ie不支持
};
};
</script>
</head> <body>
<img id="img1" src="img/miaov (0).jpg" />
<!--<div id="bg"></div>
<div id="prog">
360度全景展示 载入中......<span>0%</span>
<div id="bar"></div>
</div>-->
</body>
</html>
图片缩略转示:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片缩略图转示</title>
<link href="css/css.css" rel="stylesheet" />
<script src="js/move.js"></script>
<script>
window.onload=function ()
{
var oDiv=document.getElementById('box');
var aPicLi=document.getElementById('pic_list').getElementsByTagName('li');
var aTxtLi=document.getElementById('text_list').getElementsByTagName('li');
var oIcoUl=document.getElementById('ico_list').getElementsByTagName('ul')[0];
var aIcoLi=document.getElementById('ico_list').getElementsByTagName('li');
var oBtnPrev=document.getElementById('btn_prev');
var oBtnNext=document.getElementById('btn_next');
var iNow=0;
var iNowUlLeft=0;
oBtnPrev.onclick=function() {
if(iNowUlLeft>0) {
iNowUlLeft--;
//oIcoUl.style.left=-aIcoLi[0].offsetWidth*iNowUlLeft+'px';
fixUlLeft();
}
}; function fixUlLeft()
{
oBtnPrev.className=iNowUlLeft==0?'btn':'btn showBtn';
oBtnNext.className=iNowUlLeft==(aIcoLi.length-7)?'btn':'btn showBtn';
miaovStartMove(oIcoUl, {left: -aIcoLi[0].offsetWidth*iNowUlLeft}, MIAOV_MOVE_TYPE.BUFFER);
} oBtnNext.onclick=function() {
if(iNowUlLeft<aIcoLi.length-7) {
iNowUlLeft++; //oIcoUl.style.left=-aIcoLi[0].offsetWidth*iNowUlLeft+'px';
fixUlLeft();
}
}; for(var i=0; i<aIcoLi.length; i++)
{
aIcoLi[i].index=i;
aIcoLi[i].onclick=function() {
if(iNow==this.index) {
return;
}
iNow=this.index;
tab();
};
} function tab() {
for(var i=0; i<aIcoLi.length; i++)
{
if(i==iNow) {
aIcoLi[iNow].className='active';
aTxtLi[iNow].getElementsByTagName('h2')[0].className='show';
//aPicLi[this.index].style.filter='alpha(opacity:100)';
//aPicLi[this.index].style.opacity=100;
miaovStartMove(aPicLi[iNow], {opacity:100}, MIAOV_MOVE_TYPE.BUFFER);
} else {
aIcoLi[i].className='';
aTxtLi(i).getElementsByTagName('h2')[0].className='';
aPicLi[i].style.filter='alpha(opacity:0)';
aPicLi[i].style.opacity=0;
miaovStopMove(aPicLi[i]);
}
}
} function autoPlay() {
iNow++;
if(iNow>=aIcoLi.length)
iNow=0;
if(iNow<iNowUlLeft)
iNowUlLeft=iNow;
else if(iNow>=iNowUlLeft+7)
iNowUlLeft=iNow-6;
fixUlLeft();
tab();
}
var timer=setInterval(autoPlay, 3000);
oDiv.onmouseover=function(){
clearInterval(timer);
};
oDiv.onmouseout=function(){
timer=setInterval(autoPlay, 3000);
};
};
</script>
</head> <body>
<div id="box">
<ul id="pic_list">
<li style="z-index:2;opacity:1;fliter:alpha(opacity=100);">
<a href="http://www.miaov.com"><img src="img/pic_1.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_2.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_3.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_4.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_5.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_6.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_7.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_8.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_9.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_10.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_11.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_12.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_13.jpg" alert="我是你"/></a>
</li>
<li>
<a href="http://www.miaov.com"><img src="img/pic_14.jpg" alert="我是你"/></a>
</li>
</ul>
<div class="mark"></div> <ul id="text_list">
<li><h2 class="show"><a href="#">《武则天秘史》[至22集]姐姐与皇上偷情,媚娘抓奸在床...</a></h2></li>
<li><h2><a href="#">《无底洞》金钱、美女、权利、复仇等欲望让人不可自拔...</a></h2></li>
<li><h2><a href="#">《巴黎宝贝》邓超巴黎当奶爸,上演基情、卖萌、跨国恋..</a></h2></li>
<li><h2><a href="#">《我的女儿是花儿》[至3集]“富二代”冰王子恋上贫家女..</a></h2></li>
<li><h2><a href="#">《法证先锋3》[至26集]写字楼惊现“女僵尸”尸体!</a></h2></li>
<li><h2><a href="#">《非常了得》孟非郭德纲大曝台下私生活,内地Hold姐来挑战</a></h2></li>
<li><h2><a href="#">第二届九分钟电影11月20日独家首映 视觉盛宴恭迎各位看官</a></h2></li>
<li><h2><a href="#">《快女微电影》 洪辰脸伤痊愈 快女微电影收官作复拍</a></h2></li>
<li><h2><a href="#">《称心如意》京城第一“育婴男”Hold住全场 萝莉热舞走光</a></h2></li>
<li><h2><a href="#">《男人帮》[全30集]悲喜双响炮,一个完美结局</a></h2></li>
<li><h2><a href="#">《辛亥革命》成龙、赵文瑄、李冰冰、胡歌演绎革命腥风血雨</a></h2></li>
<li><h2><a href="#">《李献计历险记》房祖名患差时症为寻女友开启超时空冒险</a></h2></li>
<li><h2><a href="#">Justin bieber女友动感热单全球首发。</a></h2></li>
<li><h2><a href="#">第八届中国(重庆)国际园林博览会</a></h2></li>
</ul>
<div id="ico_list">
<ul>
<li class="active"><a href="#"><img src="img/ico_1.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_2.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_3.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_4.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_5.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_6.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_7.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_8.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_9.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_10.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_11.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_12.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_13.jpg" alt="我是你"/></a></li>
<li><a href="#"><img src="img/ico_14.jpg" alt="我是你"/></a></li>
</ul>
</div>
<a href="#" id="btn_prev" class="btn"></a>
<a href="#" id="btn_next" class="btn showBtn"></a>
</div>
</body>
</html>
图片缩放实例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>放大镜 - 预览 -mingliu</title>
<style type="text/css">
*{ margin:0;}
#div1 { width: 200px; height: 200px; padding: 5px; border: 1px solid #ccc; position: relative;} #div1 .small_pic { width: 200px; height: 200px; background: #eee; position: relative;}/**<!--放小图片-->*/
#div1 .float_layer { width: 50px; height: 50px; border: 1px solid #000; background: #fff; filter: alpha(opacity: 30); opacity: 0.3; position: absolute; top: 0; left: 0; display:none;}/**<!--放小方块-->>*/
#div1 .mark {width:100%; z-index:2; height:100%; position:absolute; left:0px; top:0px; background:red; cursor:crosshair; filter:alpha(opacity:0); opacity:0;}/**<!--放遮罩层-->>*/
#div1 .big_pic { position: absolute; top: -1px; left: 215px; width:250px; height:250px; overflow:hidden; border:2px solid #CCC; display:none; }/**<!--放大图-->>*/
#div1 .big_pic img { position:absolute; top: -30px; left: -80px; }
</style>
<script type="text/javascript">
function getByClass(oParent, sClass)
{
var aEle=oParent.getElementsByTagName('*');//*得到指定oParent对象下的所有对象
var aTmp=[]; //存放被选中sClass类的对象
var i=0; for(i=0;i<aEle.length;i++)
{
if(aEle[i].className==sClass)
{
aTmp.push(aEle[i]);//找到就push到数组中
}
} return aTmp;
} window.onload=function ()
{
var oDiv=document.getElementById('div1');
var oMark=getByClass(oDiv, 'mark')[0];
var oFloat=getByClass(oDiv, 'float_layer')[0];
var oBig=getByClass(oDiv, 'big_pic')[0];
var oSmall=getByClass(oDiv, 'small_pic')[0];
var oImg=oBig.getElementsByTagName('img')[0];
oMark.onmouseover=function() {
oFloat.style.display="block";
oBig.style.display="block";
};
oMark.onmouseout=function() {
oFloat.style.display="none";
oBig.style.display="none";
};
oMark.onmousemove=function(ev){
var oEvent=ev||event;
var curX=oEvent.clientX-oDiv.offsetLeft-oSmall.offsetLeft-oFloat.offsetWidth/2;
var curY=oEvent.clientY-oDiv.offsetTop-oSmall.offsetTop-oFloat.offsetHeight/2;
if(curX<0)
curX=0;
else if(curX>oMark.offsetWidth-oFloat.offsetWidth)
curX=oMark.offsetWidth-oFloat.offsetWidth;
if(curY<0)
curY=0;
else if(curY>oMark.offsetHeight-oFloat.offsetHeight)
curY=oMark.offsetHeight-oFloat.offsetHeight;
oFloat.style.left=curX+'px';
oFloat.style.top=curY+'px'; //大图移动的比率:curX:实际移动宽|高;oMark.offsetWidth-oFloat.offsetWidth(遮罩宽|高-浮动层宽|高:实际小图上总移动宽|高) 实际/总宽高就是比率
var percentX=curX/(oMark.offsetWidth-oFloat.offsetWidth);
var percentY=curY/(oMark.offsetHeight-oFloat.offsetHeight);
//大图移动大小,限制范围,防止大图出现空白部分。
oImg.style.left=-percentX*(oImg.offsetWidth-oBig.offsetWidth)+'px';
oImg.style.top=-percentY*(oImg.offsetHeight-oBig.offsetHeight)+'px';
};
}; </script>
</head> <body> <div id="div1">
<div class="small_pic">
<span class="mark"></span>
<span class="float_layer"></span>
<img src="data:images/small.png" alt="放大镜 - 预览 -mingliu" longdesc="放大镜 - 预览 -mingliu" />
</div> <div class="big_pic">
<img src="data:images/big.png" alt="放大镜 - 预览 -mingliu" longdesc="放大镜 - 预览 -mingliu" />
</div> </div> </body>
</html>
图片上下转示:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ddddddd</title>
<link href="style/common.css" type="text/css" rel="stylesheet" />
<link href="style/headerbar.css" type="text/css" rel="stylesheet" />
<!--[if IE 6]>
<script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript" src="js/ie6Fixpng.js"></script>
<![endif]-->
<script src="js/move.js"></script>
<script>
window.onload=function() {
//布局转换
var oDiv=document.getElementById('div1');
var oUl=oDiv.children[0];
var aLi=oUl.children;
var now=0; for(var i=0; i<aLi.length; i++) {
aLi[i].style.left=aLi[i].offsetLeft+'px';
if(i>=12) {
aLi[i].style.top='400px';
} else {
aLi[i].style.top=parseInt(i/4)*200+'px';
}
} for(var i=0; i<aLi.length; i++) {
aLi[i].style.position="absolute";
}
//8以后隐藏
for(var i=8; i<aLi.length; i++) {
aLi[i].style.filter='alpha(opacity=0)';
aLi[i].style.opacity=0;
} oUl.className='list';
//按钮
var aBtn=oDiv.children[1].children;
aBtn[0].onclick=function(){
var i=now+8;
if(now==0) {
return;
}
var timer=setInterval(function(){
if(i<now)
startMove(aLi[i], {top:0, opacity:100});
else if(i<now+4)
startMove(aLi[i], {top:200});
else
startMove(aLi[i], {top:400, opacity:0});
i--;
if(i==now-5) {
clearInterval(timer);
now-=4;
}
}, 40); }; aBtn[1].onclick=function(){
var i=now;
if(now>=aLi.length-8) {
return;
}
var timer=setInterval(function(){
if(i<now+4)
startMove(aLi[i], {top:-200, opacity:0});
else if(i<now+8)
startMove(aLi[i], {top:0});
else
startMove(aLi[i], {top:200, opacity:100});
i++;
if(i==now+12) {
clearInterval(timer);
now+=4;
}
}, 40);
};
};
</script>
</head> <body>
<div class="comHeadBar_black">
<a href="" target="_blank" class="fl">查看官网</a>
<a href="/" target="_blank" class="fr">by 智</a>
</div>
<div class="imgListBox" id="div1">
<ul class="list hidden">
<li><a href="javascript:;"><img src="data:images/photo/01.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/02.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/03.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/04.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/05.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/06.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/07.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/08.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/09.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/10.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/11.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/12.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/13.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/14.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/15.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/16.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/17.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/18.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/19.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/20.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/09.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/10.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/11.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/12.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/13.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/14.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/15.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/16.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/17.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/18.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/19.jpg" alt="www.zhinengshe.com" /></a></li>
<li><a href="javascript:;"><img src="data:images/photo/20.jpg" alt="www.zhinengshe.com" /></a></li>
</ul>
<div class="page">
<a href="javascript:;" class="prev"></a>
<a href="javascript:;" class="next"></a>
<span class="prev_ie6"></span>
<span class="next_ie6"></span>
</div>
</div>
</body>
</html>
左右跳动列表 :
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>dddd</title>
<link href="style/common.css" type="text/css" rel="stylesheet" />
<link href="style/headerbar.css" type="text/css" rel="stylesheet" />
<!--[if IE 6]>
<script type="text/javascript" src="js/DD_belatedPNG_0.0.8a-min.js"></script>
<script type="text/javascript" src="js/ie6Fixpng.js"></script>
<![endif]-->
<script src="js/move.js"></script>
<script>
window.onload=function() {
var oDiv=document.getElementById('div1');
var oNavBox=oDiv.children[0];
var oUl=oDiv.children[1];
var aLi=oUl.children; var opened=false;
for(var i=0; i<aLi.length; i++) {
if(i%2)
aLi[i].style.left=-aLi[0].offsetWidth+'px';
else
aLi[i].style.left=aLi[0].offsetWidth+'px';
} oNavBox.onclick=function() { if(opened) {
var i=aLi.length-1;
var lleft=i%2==0? -aLi[i].offsetWidth:aLi[i].offsetWidth;
var timer=setInterval(function(){
startMove(aLi[i], {left:lleft, opacity:0});
i--;
if(i==-1)
clearInterval(timer);
}, 77);
} else {
var i=0;
var timer=setInterval(function(){
startMove(aLi[i], {left:0, opacity:100});
i++;
if( i==aLi.length)
clearInterval(timer);
}, 77);
}
if(opened)
opened=false;
else
opened=true;
}; for(var i=0; i<aLi.length; i++) {
aLi[i].onclick=function() {
var oSpan=oNavBox.children[0];
oSpan.innerHTML=this.children[0].innerHTML;
var i=aLi.length-1;
var lleft=i%2==0? -aLi[i].offsetWidth:aLi[i].offsetWidth;
var timer=setInterval(function(){
startMove(aLi[i], {left:lleft, opacity:0});
i--;
if(i==-1)
clearInterval(timer);
}, 77);
opened=false;
};
} };
</script>
</head> <body>
<div class="comHeadBar">
<a href="" target="_blank" class="fl">查看官网</a>
<a href="" target="_blank" class="fr">by 智能</a>
</div>
<div class="warp" id="div1">
<div class="navBox">
<span><img src="data:images/ico_01.png" alt="" style="display:none;" />请选择</span>
<em class="triangle"><i></i></em>
</div>
<ul class="navList">
<li><a href="javascript:;"><img src="data:images/ico_01.png" alt="" />关于我们</a></li>
<li><a href="javascript:;"><img src="data:images/ico_02.png" alt="" />联系我们</a></li>
<li><a href="javascript:;"><img src="data:images/ico_03.png" alt="" />官网首页</a></li>
<li><a href="javascript:;"><img src="data:images/ico_04.png" alt="" />课程案例</a></li>
<li><a href="javascript:;"><img src="data:images/ico_05.png" alt="" />智能公益</a></li>
<li><a href="javascript:;"><img src="data:images/ico_06.png" alt="" />智能论坛</a></li>
</ul>
</div>
</body>
</html>
待续...
js预解析及特效的更多相关文章
- js预解析相关知识总结以及一些好玩的面试题
js预解析的题像在做智力题一样有意思~ 预解析 预解析:在解释这行代码之前发生的事情——变量的声明提前了,函数的声明提前 console.log(num) ——未定义Num,结果是报错 var num ...
- JS预解析
1.在逐行读js代码前,解析器会先提取所有声明的var变量和函数 js解析器会先把脚本里所有var变量声明读一遍,但是它只读变量名字,不读变量值,一开始它会赋给所有读到的var变量一个[未定义]的值. ...
- js预解析问题总结
//示例 1 alert(a) // undefind. alert(fn) // function 整个函数块. var a = 1; function fn(){ return falss; }; ...
- [妙味JS基础]第六课:作用域、JS预解析机制
知识点总结 浏览器的解析方法 script 全局变量,全局函数 自上而下 函数 由里到外 "JS的解析器": 1)“找一些东西”:var function 参数 var a=未定义 ...
- javascript . 03 函数定义、函数参数(形参、实参)、函数的返回值、冒泡函数、函数的加载、局部变量与全局变量、隐式全局变量、JS预解析、是否是质数、斐波那契数列
1.1 知识点 函数:就是可以重复执行的代码块 2. 组成:参数,功能,返回值 为什么要用函数,因为一部分代码使用次数会很多,所以封装起来, 需要的时候调用 函数不调用,自己不会执行 同名函数会覆盖 ...
- JS预解析机制
JS的预解析过程: 1,预解析 2,再逐行解读代码, 实例: ---------------------------- <script> var name="xm& ...
- js 预解析
前言 JavaScript是解释型语言是毋庸置疑的,但它是不是仅在运行时自上往下一句一句地解析的呢? 事实上或某种现象证明并不是这样的,通过<JavaScript权威指南>及网上相关资料了 ...
- js---07 js预解析,作用域---闭包
js解析器首先不会逐行读代码,这是第二部了. 首先 根据var找到变量,根据function找函数,找到变量var a = 1,js解析器只会读取等号前面的var a,并把a设置值未定义,并不会读取等 ...
- js 预解析以及变量的提升
js在执行之前会进行预解析. 什么叫预解析? 预:提前 解析:编译 预解析通俗的说:js在执行代码之前会读取js代码,会将变量声明提前. 变量声明包含什么?1.var 声明 2.函数的显示声明. 提前 ...
随机推荐
- nfs文件系统挂载错误及解决方法
挂载nfs时出现如下错误: 原因: 没有安装nfs客户端相关 解决方法: apt-get install nfs-common 参考资料: http://askubuntu.com/questions ...
- Java多线程(转)
文章转自http://286.iteye.com/blog/2292038 谢谢博主的总结! 进程(Process)是计算机中的程序关于某数据集合上的一次运行活动,是系统进行资源分配和调度的基本单位, ...
- 内网公告牌获取天气信息解决方案(C# WebForm)
需求:内网公告牌能够正确显示未来三天的天气信息 本文关键字:C#/WebForm/Web定时任务/Ajax跨域 规划: 1.天定时读取百度接口获取天气信息并存储至Txt文档: 2.示牌开启时请求Web ...
- SSH整合!!!!不会的赶紧来
说到SSH也就是Spring,struts2,Hibernate三大框架那么咱们话不多说开始搭建吧 首先我们这个项目的目的是应用三大框架将一个商品的信息保存到数据库中. 第一步就是创建Web项目,引入 ...
- UICollectionview实现自定义cell的移动删除
今天 ,有群里人询问了 ,支付宝首页的UICollectionview 的cell(其实不能成为cell,应该是item,不过大家习惯这么称呼了)怎么实现 自定义的拖拽 和删除,然后我查了下资料,它的 ...
- Java(六)——抽奖系统
总体思路: 将编号加入ArrayList动态数组中,利用集合的静态方法Collections.shuffle() 乱序集合中的元素从而获得随机数,remove删除已抽编号 代码如下: import ...
- 黑马程序员:Java编程_IO流
=========== ASP.Net+Android+IOS开发..Net培训.期待与您交流!=========== 流是一组有顺序的,有起点和终点的字节集合,是对数据传输的总称或抽象.即数据在两设 ...
- Android 学习第17课,使用文件的数据存储(4种存储模式)
Context.MODE_PRIVATE:为默认操作模式,代表该文件是私有数据,只能被应用本身访问,在该模式下,写入的内容会覆盖原文件的内容,如果想把新写入的内容追加到原文件中.可以使用Context ...
- 旷世奇坑!!!spring 不能自动注入
一入此坑,只想跳楼.我发誓应该不会有第二个人会进这种坑! 问题描述: 总是不能注入dao层,即@Resposity.always!always!always!(尝试了天下之因特网所有的注入方式,都不能 ...
- Unity C# XmlDoc.LoadXml() il2cpp not implemented exception
Stuck with this for a couple of hours, turned out it's just a setting thing, Answer from this post ( ...