js函数实参传入的原理
问题:我创建了2个函数changepic和moveto(elem)函数,在changepic函数中 调用moveto函数并直接传入dom对象,在moveto函数中修改dom对象属性,但是在页面上不生效的问题,实在找不出问题出在哪了。附上代码
结构
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<link href="css/mycss.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="wrap" id="a">
<div class="view">
<ul>
<li><img src="images/01.jpg" /></li>
<li><img src="images/02.jpg" /></li>
<li><img src="images/03.jpg" /></li>
<li><img src="images/04.jpg" /></li>
<li><img src="images/05.jpg" /></li>
</ul>
</div>
</div>
<script src="js/check_tools.js"></script>
<script>
window.onload=function(){
changepic('a');
}
</script>
</body>
</html>
js
/******************元素移动函数***************************/
function move_to(elem){
alert(elem);
var l=elem.style.left;
var t=elem.style.top;
elem.style.left="0px";
/*if(!l){
l=-200;
k=l+"px";
alert(k);
elem.style.left=k;
}
if(!t){
t=300;
elem.style.top=t+"px";
}*/
}
/*****************改变图片位置***************************/
function changepic(myitem){
/***初始化****/
var mitem=document.getElementById(myitem);
var img_width=400;
var ul=mitem.getElementsByTagName("ul")[0];
var lis=ul.getElementsByTagName("li");
var ul_width=img_width*lis.length;
var str="";
var timer1=null;
var timer2=null;
var time_interval=100;
ul.style.left="-100px";
//ul.style.top="0px";
for(var i=0; i<lis.length;i++){
str+="<button type='button'>"+(i+1)+"</button>";
}
mitem.innerHTML+=str;
/*****调用元素移动函数*****/
move_to(ul);
}
css
@charset "utf-8";
/* CSS Document */
*{ margin:0px; padding:0px}
ul{ list-style:none}
.wrap{ width:400px; border:1px solid; margin:10px; text-align:center;}
.wrap button{ height:20px; width:20px; margin:5px; border:none}
.wrap .view{ height:260px; width:400px; position:relative; /*overflow:hidden;*/}
.wrap .view ul{ white-space:nowrap; font-size:0px; position:absolute; left:0px; top:0px;}
.wrap .view li{ display:inline;}