百度IFE学习笔记（二）js 添加DOM子节点

需求页面如下：

<ul id="resort">    <!--    <li>第一名：北京空气质量：<b>90</b></li>    <li>第二名：北京空气质量：<b>90</b></li>    <li>第三名：北京空气质量：<b>90</b></li>     --></ul>

js添加子节点：

var ul=document.getElementById("resort");for(i=0;i<data.length;i++){            var text_li = "第"+(i+1)+"名："+data[i][0]+"空气质量：";                        var node_li=document.createElement("li");            var textnode_li = document.createTextNode(text_li);            node_li.appendChild(textnode_li);            var node_b=document.createElement("b");            var text_b=data[i][1];            var textnode_b = document.createTextNode(text_b);            node_b.appendChild(textnode_b);            node1.appendChild(node_b);            ul.appendChild(node_li);        }

分析：（子节点需创建并绑定到父节点，才能在页面中显示）

DOM结构图：

createElement ：创建元素节点

createTextNode：创建文本节点

appendChild：向父节点的子节点序列的末尾添加一个子节点