首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

JS的DOM有关问题求教

2012-03-19 
JS的DOM问题求教如下:JScript codediv ul idtestli onmouseovertaskIndex()这是第一个LI/li

JS的DOM问题求教
如下:

JScript code
<div> <ul id="test">  <li onmouseover="taskIndex();">这是第一个LI</li>  <li onmouseover="taskIndex();">这是第二个LI</li>  <li onmouseover="taskIndex();">这是第三个LI</li>  <li onmouseover="taskIndex();">这是第四个LI</li>  <li onmouseover="taskIndex();">这是第五个LI</li> </ul><div>


当鼠标指向的时候,弹出提示当前是ID=TEST元素的子元素的第几个,比如第一个LI显示0,第二个LI显示1,是怎么获知的?

[解决办法]
<div>
 <ul id="test">
<li onmouseover="taskIndex(this);">这是第一个LI</li>
<li onmouseover="taskIndex(this);">这是第二个LI</li>
<li onmouseover="taskIndex(this);">这是第三个LI</li>
<li onmouseover="taskIndex(this);">这是第四个LI</li>
<li onmouseover="taskIndex(this);">这是第五个LI</li>
 </ul>
<div>
<script>
function taskIndex(li){
var list=li.parentNode.getElementsByTagName("li");
for(var i=0;i<list.length;i++){
if(list[i]==li){
alert("这是第"+(i+1)+"个LI");
break;
}
}
}
</script>
[解决办法]
顶一楼,二楼虽然代码简洁,不过兼容性较差,只适合IE浏览器
[解决办法]
HTML code
<script> function taskIndex(o){    var li = document.getElementById("test").getElementsByTagName("li");        for(var i = 0, len = li.length; i < len; i++){         if(li[i] == o){             alert("这是第"+(i+1)+"个LI");             return;        }     }}</script><div> <ul id="test">  <li onmouseover="taskIndex(this);">这是第一个LI</li>  <li onmouseover="taskIndex(this);">这是第二个LI</li>  <li onmouseover="taskIndex(this);">这是第三个LI</li>  <li onmouseover="taskIndex(this);">这是第四个LI</li>  <li onmouseover="taskIndex(this);">这是第五个LI</li> </ul></div> 

热点排行