create系列创建节点的方法

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>create系列创建节点的方法</title>
    <!-- 
        document.createElement("元素a");创建元素节点a
        document.createTextNode("文本a");创建文本节点a
        document.createDocumentFragment();创建文档片段
        document.createComment("注释a");创建注释a
        a.appendChild(b);使b作为子节点附加在a节点上

        扩展知识:父元素a.insertBefore(节点b,节点c);
                解读:将节点b插入节点a内节点c的前面
     -->
</head>
<body>
    <ul id="ul1"></ul>
    <script>
        var ul=document.getElementById("ul1");//获取无序列表
        var li=document.createElement("li");//创建列表项
        var text=document.createTextNode("text");//创建文本
        var fragment=document.createDocumentFragment();//创建文档片段
        var comment=document.createComment("js 中创建的注释");//创建注释
        li.appendChild(text);//将文本附加给列表项
        fragment.appendChild(li);//将列表项附加给文档片段
        ul.appendChild(fragment);//将文档碎片附加给无序列表
        document.body.insertBefore(comment,document.body.firstChild);//将创建的注释安插在body的第一行
    </script>
</body>
</html>

猜你喜欢

转载自www.cnblogs.com/vinson-blog/p/12077534.html
今日推荐