<body>
<ul>
<li id="l1"></li>
<li id="L1"></li><!--注意这里是大写-->
<li id="l1"></li>
</ul>
<input type="text" name="l1" />
<input type="text" name="l1" />
</body>
<script>
/***********************
* W3C规定一个文档中的id是唯一的,所有getElementByid的上下文必须是document;
* 如果在页面中,id重复了,只会获取第一个;
* 在ie6-7下,id是不区分大小写的;
* 在ie6-7下,表单元素的name属性会被当做id使用
* 项目规范:
* 给元素命名id的时候,不能给用大小写来区别一个id值;
* 表单元素的name值不要与id重名;
* **********************/
var oL1=document.getElementById('l1');
var oL2=document.getElementById('L1');
oL1.style.background='#ec393c'; //ie7:input的name值会被取到
oL2.style.backgroundColor='#666'; //ie7支持这行代码,ie8开始显示正常
/*
* 如果把<script>标签放在</body>结束标签后面,可以直接使用id;
* 但在真实项目中,不能这样做,此处仅供了解.
*/
</script>