cari

Rumah  >  Soal Jawab  >  teks badan

javascript - 通过js动态增加html节点

var cityHtml = "";
var cityNum = 0;
for (var index in departmentList) {
    var depart = departmentList[index];
    var html = "<td>

<p>" + depart.departmentName + "</p>

</td>";

    if (depart.updepartment == -1) {
        var tr = document.createElement("tr");
        tr.innerHTML = html;
        $("#province").append(tr);
    }
    //省级的编号是1
    else if (depart.updepartment == 1) {
        cityHtml += html;
        cityNum++;
                //每四个一行     
                if (cityNum % 4 == 0) {
            var cityTr = document.createElement("tr");
            cityTr.innerHtml = cityHtml;
            $("#city").append(cityTr);

            cityHtml = "";
        }
    }

}
var cityTr = document.createElement("tr");
cityTr.innerHtml = cityHtml;
$("#city").append(cityTr);


----------


<p id="province"></p>




<p id="city"></p>



上面是我的代码,但是得到的结果确实province的p能显示值,而city的p显示的是空的,请问是为什么呢?

阿神阿神2897 hari yang lalu365

membalas semua(2)saya akan balas

  • 怪我咯

    怪我咯2017-04-10 15:02:29

    是用IE10以下吗? 在chrome内核的看有没有问题
    IE9以下的的innerHTML 是只读
    以前做动态生成表格兼容的时候就遇到过了,只能替换节点,在网上找了下修改了下有下面的代码,你看下参考

    html里面这样画表格

         <table id="spvisWindow" class=" spvisTable" border="1" cellspacing="0" cellpadding="0" align="center">
            <tbody id="tabbody" >
            </tbody>
          </table>
    

    JS代码这样写
    下面是增加内容的函数:

    function addReSpTab(tabContent)
    {
        var tabDom = document.getElementById("spvisWindow");
        var tabbody = document.getElementById("tabbody");
            if(tabbody.innerHTML!=null)
            var tempbody =tabbody.innerHTML; 
    
            //IE不支持Tab的innerHTML,所以要区分对待    
            var isIE=!!window.ActiveXObject; 
            if(isIE)
            {
                addTableInnerHTML(tabDom, tabContent+tempbody);
            }else
            {
                tabbody.innerHTML = tabContent + tabbody.innerHTML; 
            }
    
    };
    

    下面是IE使用的函数

        //IE使用,增加一栏数据,替换渲染DOM
    function addTableInnerHTML(table, html) { 
    
            var temp = table.ownerDocument.createElement('p'); 
            temp.innerHTML = '<table><tbody id="tabbody">' + html + '</tbody></table>'; 
            if(table.tBodies.length == 0)
                { 
                    var tbody=document.createElement("tbody"); 
                    table.appendChild(tbody); 
                } 
            table.replaceChild(temp.firstChild.firstChild, table.tBodies[0]);
    
    
    } 
    

    其中function addReSpTab(tabContent)的参数tabContent就是一串字符串

    <tr >....</tr>
    
        其实这段代码核心就是增加<tbody></tbody>再替换tbody的内容。
    

    balas
    0
  • 阿神

    阿神2017-04-10 15:02:29

    不好意思,小问题innerHtml应该写成innerHTML

    balas
    0
  • Batalbalas