html——触发器增加、删除、显示行数

来源：互联网发布：怎么看淘宝注册日期编辑：程序博客网时间：2024/06/05 18:41

<html>
    <head>
        <title>1+1=3</title>
            <script type="text/javascript">
           //生成ul
           window.onload = function(){
                var oUi = document.getElementsByTagName("ul");
                var str = "";
                for(var i=0;i<50;i++){
                    str += "<li id="+i+">#"+i+"</li>";
                }
                oUi[0].innerHTML = str;
                    var oli=document.getElementsByTagName('li');
            for(var i=0;i<oli.length;i++)
            {
                (function(n){
                    oli[i].onclick=function(){
                        alert("当前项是："+n);
                    }
                })(i)
            }

            }

function clearText() {
      var x=list.removeChild(list.childNodes[5]);
      alert("删除5节点的内容："+x.innerHTML+"<br/>");
}

function addText() {
var otest = document.getElementById("list");
var newnode=document.createElement("li");
var node=document.getElementById("10");
newnode.innerHTML="baidu.com /";
otest.insertBefore(newnode,node);
/*要先取node的值并且创建newnode，使用格式是父节点.inserBefore（newnode,node）*/
}

</script>

    </head>
    <body>

        <ul id="list" class="foo"></ul>
       <button onclick="clearText()">清除节点内容</button>
       <button onclick="addText()">增加节点内容</button>
    </body>
</html>

阅读全文

0 0