ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

Javascript——元素动态创建表格反正也看不懂

2019-07-10 22:35:48  阅读:279  来源: 互联网

标签:www 创建表格 看不懂 Javascript href https table tableObj name


<body>
<input type="button" value="创建表格" id="btn"/>
<div id="dv"></div>
<script src="common.js"></script>
<script>
var arr=[
    {name:"百度", href: "https://www.baidu.com/"},
    {name:"谷歌", href: "https://www.google.com/"},
    {name:"CSDN", href: "https://www.csdn.net/"},
    {name:"GitHub", href: "https://github.com/"},
]
    //点击按钮创建表格
    my$("btn").onclick=function(){
        //创建table加入到div中
        var tableObj=document.createElement("table");
        tableObj.border="1";
        tableObj.cellPadding="0";
        tableObj.cellSpacing="0";
        my$("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 td1=document.createElement("td");
            td1.innerText=dt.name;
            trObj.appendChild(td1);
            //创建第二个列
            var td2=document.createElement("td");
            td2.innerHTML="<a href="+dt.href+">"+dt.name+"</a>";
            trObj.appendChild(td2);
        }
    };
</script>
</body>

标签:www,创建表格,看不懂,Javascript,href,https,table,tableObj,name
来源: https://blog.csdn.net/mintsolace/article/details/95380739

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有