javascript 动态创建table数据(处理了ie6,7兼容问题)

最新推荐文章于 2020-06-02 17:08:40 发布

永远爱好写程序

最新推荐文章于 2020-06-02 17:08:40 发布

阅读量1.1k

点赞数

分类专栏： Javascript

本文链接：https://blog.csdn.net/limlimlim/article/details/8424704

版权

Javascript 专栏收录该内容

56 篇文章 0 订阅

订阅专栏

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>添加网格数据(处理了IE兼容问题)</title>
    <script type="text/javascript">
        function AppendData() {
            var data = {"中国新鸽网":"http://www.chinaxinge.com",
                        "百度":"http://www.baidu.com",
                        "搜狐": "http://www.sohu.com"};
            var table = document.getElementById("tblMain");
            for (var key in data) {
                var value = data[key];
                var tr = table.insertRow(-1); //FireFox必须使用-1这个参数

var td1 = tr.insertCell(-1);
td1.innerText = key;

                var td2 = tr.insertCell(-1);
                td2.innerHTML = "<a href='" + value + "'>" + value + "</a>";
            }
        }
    </script>
</head>
<body>
    <table border="1" id="tblMain"></table>
    <input type="button" value="添加网格数据(处理了IE兼容问题)" οnclick="AppendData()" />
</body>
</html>

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

方法2

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>动态创建表格(处理IE6兼容问题)</title>
    <script type="text/javascript">
        function AppendTableData() {
            var table = document.getElementById("tblMain");
            var data = { "百度": "http://www.baidu.com",
                "中国信鸽网": "http://www.chinaxinge.com",
                "搜狐": "http://www.sohu.com"
            };
            for (var key in data) {
                var tr = document.createElement("tr");

                var td1 = document.createElement("td");
                td1.innerText = key;
                tr.appendChild(td1);

                var td2 = document.createElement("td");
                td2.innerHTML = "<a href='" + data[key] + "'>" + data[key] + "</a>";
                tr.appendChild(td2);

//table.appendChild(tr); 把这一句替换掉
                table.tBodies[0].appendChild(tr);
            }
        }
    </script>
</head>
<body>
    
    <table id="tblMain"><tbody></tbody></table>
    <input type="button" value="动态添加网格数据" οnclick="AppendTableData()" />
</body>
</html>

永远爱好写程序

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript 动态创建table数据(处理了ie6,7兼容问题)

http://www.w3.org/1999/xhtml"> 添加网格数据(处理了IE兼容问题) function AppendData() { var data = {"中国新鸽网":"http://www.chinaxinge.com", "百度":"http://www.b
复制链接

扫一扫

专栏目录