• 创建表格及只创建一个元素的方法


    <input type="button" value="点击" id="bt"/>
    <div id="dv"></div>
    <script src="commer.js"></script>
    <script>
    var arr=[
    {name:"百度",href:"http://www.baidu.com"},
    {name:"谷歌",href:"http://www.baidu.com"},
    {name:"爱奇艺",href:"http://www.baidu.com"},
    {name:"优酷",href:"http://www.baidu.com"},
    {name:"腾讯",href:"http://www.baidu.com"}
    ];
    //点击按钮创建表格
    ver("bt").onclick=function () {
    //创建table加入到div中
    var tableObj=document.createElement("table");
    tableObj.border="1";
    tableObj.cellPadding="0";
    tableObj.cellSpacing="0";
    ver("dv").appendChild(tableObj);
    //创建行,把行加入到table中
    for(var i=0;i<arr.length;i++){
    var dt=arr[i];//每个对象
    var trObj=document.createElement("tr");
    tableObj.appendChild(trObj);
    //创建第一个列,然后加入到行中
    var tb1=document.createElement("td");
    tb1.innerText=dt.name;
    tableObj.appendChild(tb1);
    //创建第二个列
    var tb2=document.createElement("td");
    tb2.innerHTML="<a href="+dt.href+">"+dt.name+"</a>";
    tableObj.appendChild(tb2);
    }
    };

    </script>





    <input type="button" value="点击" id="btn"/>
    <div id="dv"></div>
    <script src="commer.js"></script>
    <script>
    //有则删除,无则创建

    //先判断有没有,有就删除,没有就创建,创建多次,但还是显示一个
    // ver("btn").onclick=function () {
    // //判断这个div中有没有按钮,有就删除
    // //判断这个按钮的子元素是否存在
    // if(ver("btn2")){
    // ver("dv").removeChild(ver("btn2"));
    // }
    // var Obj=document.createElement("input");
    // Obj.type="button";
    // Obj.value="按钮";
    // Obj.id="btn2";
    // ver("dv").appendChild(Obj);
    // };

    //只创建一次
    ver("btn").onclick=function () {
    //判断这个div中有没有按钮,有就删除
    //判断这个按钮的子元素是否存在
    if(!ver("btn2")){
    var Obj=document.createElement("input");
    Obj.type="button";
    Obj.value="按钮";
    Obj.id="btn2";
    ver("dv").appendChild(Obj);
    }
    };


    </script>
  • 相关阅读:
    java并发系列(六)-----Java并发:volatile关键字解析(内存语义、实现原理)
    java并发系列(五)-----如何正确的关闭一个线程
    23.备忘录模式(Memento Pattern)
    22.访问者模式(Vistor Pattern)
    21.责任链模式
    20.策略者模式(Stragety Pattern)
    19.状态者模式(State Pattern)
    18.中介者模式(Mediator Pattern)
    17.观察者模式(Observer Pattern)
    16.迭代器模式(Iterator Pattern)
  • 原文地址:https://www.cnblogs.com/lujieting/p/10050433.html
Copyright © 2020-2023  润新知