关于document.body.appendChild在ie6兼容问题

最新推荐文章于 2019-03-25 16:39:14 发布

allenlily

最新推荐文章于 2019-03-25 16:39:14 发布

阅读量2.6k

点赞数

分类专栏： DOM javascript 文章标签： ie table button 百度 input 微软

本文链接：https://blog.csdn.net/allenlily/article/details/7292409

版权

DOM 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

javascript

3 篇文章 0 订阅

订阅专栏

function inserText() {
            var urldata = {"百度":"http://www.baidu.com","谷歌":"http://www.google.com","微软":"http://www.microsoft.com"};
            var table = document.getElementById("btntable");
            for (var key in urldata) {
                var urlName = urldata[key];
                var tr1 = document.createElement("tr");
                var td1 = document.createElement("td");
                td1.innerText = key;
                tr1.appendChild(td1);

                var td2 = document.createElement("td");
                td2.innerHTML = "<a href='" + urlName + "'>" + urlName + "</a>";
                tr1.appendChild(td2);
                table.appendChild(tr1);
            }
        }

在IE6里通过DebugBar来观察,

<TABLE id=btntable>
<TBODY ></TBODY>
<TR>
<TD>百度</TD>
<TD><A href="http://www.baidu.com/">http://www.baidu.com</A></TD></TR>
<TR>
<TD>谷歌</TD>
<TD><A href="http://www.google.com/">http://www.google.com</A></TD></TR>
<TR>
<TD>微软</TD>
<TD><A href="http://www.microsoft.com/">http://www.microsoft.com</A></TD></TR></TABLE>

在IE6里多了<TBODY ></TBODY>这对标签,IE6默认显示<TBODY ></TBODY>里的内容,所以我们生成的内容不能显示

解决办法:

<body>
    <table id="btntable">
     <tbody id="td"></tbody>//自己动手添加这个标签
    </table>
    <input type="button" οnclick="inserText()" value="插入内容"/>
</body>

function inserText() {
            var urldata = {"百度":"http://www.baidu.com","谷歌":"http://www.google.com","微软":"http://www.microsoft.com"};
            var tbody= document.getElementById("bt");//只要获得tbody元素
            for (var key in urldata) {
                var urlName = urldata[key];
                var tr1 = document.createElement("tr");
                var td1 = document.createElement("td");
                td1.innerText = key;
                tr1.appendChild(td1);

                var td2 = document.createElement("td");
                td2.innerHTML = "<a href='" + urlName + "'>" + urlName + "</a>";
                tr1.appendChild(td2);
                tbody.appendChild(tr1);//在tbody里添加tr1就大功告成..
            }
        }

allenlily

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
关于document.body.appendChild在ie6兼容问题

function inserText() { var urldata = {"百度":"http://www.baidu.com","谷歌":"http://www.google.com","微软":"http://www.microsoft.com"}; var table = document.getElementById("btntable
复制链接

扫一扫