js 将带字符串参数的函数赋值给变量注意事项

最新推荐文章于 2022-08-26 11:08:53 发布

ssp1000

最新推荐文章于 2022-08-26 11:08:53 发布

阅读量2.4k

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/ssp1000/article/details/80116766

版权

js 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <link rel="stylesheet" type="text/css" href="css/layout.css"/>
    </head>
    <body>
        <h1>Web Design</h1>
        <p>These are things you should know.</p>
        <ol id="linklist">
            <li>
                <a href="Structure">Structure</a>
            </li>
            <li>
                <a href="Presentation">Presentation</a>
            </li>
            <li>
                <a href="Behavior">Behavior</a>
            </li>
        </ol>
        <div id="slideshow">
            <img src="img/pinjie.jpg" id="preview"/>
        </div>        
        <script src="js/donghua.js" type="text/javascript" charset="utf-8"></script>
    </body>
</html>

css:

#slideshow{
	width:300px;
	height:200px;
	position:relative;
	overflow: hidden;
}

js：

window.οnlοad=prepareSlideshow;

function prepareSlideshow(){
    var preview=document.getElementById("preview");
    preview.style.position="absolute";
    preview.style.left="0px";
    preview.style.top="0px";
    
    var list=document.getElementById("linklist");
    var links=list.getElementsByTagName("a");
    for(var i=0;i<links.length;i++){
        var n=(-1)*(i)*300;
        (function(n){
            
            links[i].οnmοuseοver=function(){
                moveElement("preview",n,0,10);
            }
        })(n);//1.函数赋值给变量在循环里必须用立即执行函数，不然i会是最后一个值。2.含不含参数n无所谓
        
    }
}

function moveElement(elementID,x,y,interval){
    var elem=document.getElementById(elementID);
    if(elem.movement) clearTimeout(elem.movement);
    var xpos=parseInt(elem.style.left);
    var ypos=parseInt(elem.style.top);
    if(xpos==x&&ypos==y) return true;
    if(xpos<x) xpos++;
    if(xpos>x) xpos--;
    if(ypos<y) ypos++;
    if(ypos>y) ypos--;
    elem.style.left=xpos+"px";
    elem.style.top=ypos+"px";
    
    var repeat="moveElement('"+elementID+"',"+x+","+y+","+interval+")";
//    讲究,这里的其实想放的是 moveElement("message",200,100,10)；
//    字符串加法会将变量直接转换为变量所对应的值，此时repeat="moveElement('message',200,100,10)"
//    若是没有这两个单引号repeat="moveElement(message,200,100,10)"，第一个变量就不是字符串而是一个变量,一个未定义的变量，（即使前文定义了也不行）
    
    elem.movement=setTimeout(repeat,interval);
//    这里的对象属性避免了上文判断未定义时的错误，又能够起到全局变量的效果
}

ssp1000

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 将带字符串参数的函数赋值给变量注意事项

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;title&gt;&lt;/title&gt; &lt;link rel="stylesheet" type="text/css&quo
复制链接

扫一扫