一、判断方面,在js中有一些东西是不能拿来做判断的,不然一判断,一个挂。
1、所有的相对路径,都不要拿来做判断;
比如说:<img />的src 、 href=''等
2、颜色值也不要拿来做判断
color: red #f00 rgb(255,0,0)
3、innerHTML也不要拿来做判断
举个小例子吧
<body>
<img src="img/1.jpg" id="img"/>
</body>
<script>
window.onload = function(){
var oImg = document.getElementById("img");
oImg.onclick = function(){
alert(oImg.src);
};
};
</script>
上边的代码,将<img />的src弹出来看一下
点击图片后,弹出如下对话框
这么长的路径,真让人崩溃。
二、<div>的浮动
如果我们想让<div>左浮动,可能会写如下代码:oDiv.style.float = 'left';
但是如果这么写的话,一些好的浏览器是能认识的,不过,总有例外;
IE(styleFloat)
非IE(cssFloat)
在IE浏览器要写成:oDiv.style.styleFloat = 'left';
在非IE浏览器要写成:oDiv.style.cssFloat = 'left';
当然,如果做不了兼容性就换换思路,比如clsaa='left' .left{float:left},用动态class实现。
三、注意一下表单元素
如下代码:
<script>
window.onload = function(){
var oInp = document.getElementById("inp");
oInp.onclick = function(){
oInp.type = 'checkbox';
};
};
</script>
<body>
<input type="button" id="inp"/>
</body>
可以很容易的看出来,这里是做了一个按钮,点击之后按钮变成了复选框。
恩,能实现;但我这也不是闲的没事干;
这里的效果是能实现,但是有三个祖宗不支持 IE6 IE7 IE8.
但如果需求就是让做这个东西,还要兼容这三个祖宗,怎么办?
一点思路:做两个<input />,一个按钮,一个复选框。复选框隐藏,点击按钮,按钮隐藏,复选框显示。ok