<html>
<head>
<meta charset="UTF-8">
<title>函数传参</title>
</head>
<style type="text/css">
#div1{
width: 200px
height: 200px
border: red solid 2px
background-color: red
background-size:cover
}
</style>
<script type="text/javascript">
function set(set1,set2){
var js_1=document.getElementById('div1')
js_1.style[set1]=set2
}
</script>
<body>
<input type="button" value="变绿" onclick="set('backgroundColor','green')" />
<input type="button" value="变宽" onclick="set('width','400px')" />
<input type="button" value="变高" onclick="set('height','400px')" />
<input type="button" value="向右" onclick="set('margin-left','200px')" />
<div id="div1">
</div>
</body>
</html>123456789101112131415161718192021222324252627282930313233123456789101112131415161718192021222324252627282930313233
先注意下 单双引号的位置
1.单引号：var js_1=document.getElementById(‘div1’）
2.单引号：onclick=”set(‘width’,’400px’)”
3.双引号 ：一般我不在 js中用双引号，除非特殊情况例
<input type="button" onclick="alert("1")">-------------------不正确
<input type="button" onclick="alert('1')">-------------------正确1212
即 代码内部有单引号时必须用双引号，其他情况本人一般都用单引号
加引号的是字符串常量（例如 id ，class）
不加引号的是变量（还有基本所有形参，和一些非实参）、、
送给 一段代码 ，上面有我说的情况，代码实现，不做解释
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
div {width:200pxheight:200pxmargin:20pxfloat:leftbackground:yellowborder:10px solid blackfilter:alpha(opacity:30)opacity:0.3}
</style>
<script>
window.onload=function ()
{
var oDiv1=document.getElementById('div1')
oDiv1.onmouseover=function ()
{
startMove(this, 'opacity', 100)
}
oDiv1.onmouseout=function ()
{
startMove(this, 'opacity', 30)
}
}
function getStyle(obj, name)
{
if(obj.currentStyle)
{
return obj.currentStyle[name]
}
else
{
return getComputedStyle(obj, false)[name]
}
}
function startMove(obj, attr, iTarget)
{
clearInterval(obj.timer)
obj.timer=setInterval(function (){
var cur=0
if(attr=='opacity')
{
cur=parseFloat(getStyle(obj, attr))*100
}
else
{
cur=parseInt(getStyle(obj, attr))
}
var speed=(iTarget-cur)/6
speed=speed>0?Math.ceil(speed):Math.floor(speed)
if(cur==iTarget)
{
clearInterval(obj.timer)
}
else
{
if(attr=='opacity')
{
obj.style.filter='alpha(opcity:'+(cur+speed)+')'
obj.style.opacity=(cur+speed)/100
}
else
{
obj.style[attr]=cur+speed+'px'
}
}
}, 30)
}
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
.style.width和style.height可以接受两种类型的赋值，一种是字符串，一种是数字，当使用数字时，一般情况下默认是使用px即像素作为单位的。
在js里面，字符串的连接符是 “+”（加号）,500+"px"里的500也会被当做字符串处理,所以完整的字符串"500px"和500+"px"的效果是一样.
而这一句：
this.style.width=500px500px既不是数字，也不是字符串，肯定会报错，解释器会将px当做一个变量来处理，500还是被当做数字的，解释器会认为500和px中间少了界定符或运算符，所以会报： "缺少 ''" 错误，而不是报："500px 不是一个有效的变量"或者"500px未定义"。
PS： To okbuzhidao112 朋友：在js中，使用不存在的变量时报的错误是：
xx未定义缺少界定符报的错误才是：
缺少 ''
