码迷,mamicode.com
首页 > 编程语言 > 详细

javaScript动态生成列表(获取点击列表的id)

时间:2017-02-08 14:29:25      阅读:178      评论:0      收藏:0      [点我收藏+]

标签:setattr   alert   列表   moni   click   div   asc   ext   获取   

我有一个div和ul代码如下:

<div id="myDiv">

    <ul id="myUl">

    </ul>
</div>

------------------------------------------------------------

<script type="text/javaScript">

        //通过id获得ul元素

        var ul = document.getElementById(‘myUl‘);
        //这里我循环5个

                      for (var i = 0; i < 5; i++) {
                        //添加 li
                        var li = document.createElement("li");
                        var a = document.createElement("a");
                        ul.appendChild(li);

         li.setAttribute("id", i+1);
                        li.setAttribute("onclick", "getId(this)");
                        li.appendChild(a);
                        a.innerHTML = “数据(可以去循环出想要的数据)”; 

 

      function getId(obj) {

        //获得点击li元素的id

        var id = obj.id;

        alert("你点击的元素id是"+id);

}

</script>

 ---------------------------------------------------

最后获得的是

<div id="myDiv" class="monitor">
    <ul id="myUl">
         <li id="1">
            <a>数据(可以去循环出想要的数据)</a>
        </li>
        <li id="2">
            <a>数据(可以去循环出想要的数据)</a>
        </li>
        <li id="3">
            <a>数据(可以去循环出想要的数据)</a>
        </li>
        <li id="4">
            <a>数据(可以去循环出想要的数据)</a>
        </li>
        <li id="5">   
            <a>数据(可以去循环出想要的数据)</a>
        </li>
            </ul>
</div>

javaScript动态生成列表(获取点击列表的id)

标签:setattr   alert   列表   moni   click   div   asc   ext   获取   

原文地址:http://www.cnblogs.com/stu-wrl/p/6377862.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!