JS DOM （二）

方法：

1. appendChild

 window.onload = function () {
            console.log(document.body);
            var four = document.createElement('div');

            console.log(four);
            document.body.appendChild(four);
            four.textContent = 'four'



        }

————注意：父元素才可操作

2. insertBefore（）

 var first = document.querySelector('.one');
            var newNode = document.createElement('div');
            document.body.insertBefore(newNode, first);
            newNode.innerHTML = 'zero point five'

——————注意，同样是父元素操作，insertBefore（参数1，参数2），参数1是新增节点，参数2是相对节点，即，在哪个节点前面新增一个节点。

3.removeChild（）

 var third = document.querySelector('.three');
            document.body.removeChild(third);

                ———

4.replaceChild（）

var five = document.createElement('div')

            document.body.replaceChild(five, third)
            five.innerHTML = 'five'

————两个参数，第一新节点，第二个参数：旧节点。

5. cloneChild（）

var third = document.body.children[2];
            var sixth = third.cloneNode(true);
            document.body.appendChild(sixth);

————，1， 先将third 第三个节点取出来，然后克隆，克隆一个值赋值给一个变量，然后将这个科隆的元素，用它的父元素调用一个appendChild（）方法，来克隆进去

获取节点内容的方法————

1. div.innerText——————强度最弱，没有格式，div内部还有别的标签也不会识别。

2.div.textContent——————有格式，但是div内部标签不识别。

3.div.innerHTML——————既有格式，还能识别内部标签。

                document类型

// 1.获取html元素

            console.log(document.documentElement);

            // 2.获取body标签

            console.log(document.body);

            // 3.获取文档头声明

            console.log(document.doctype);

            // 4.获取选项卡标题

            console.log(document.title);

            // 5.获取url路径

            console.log(document.URL);

            // 6.获取域名

            console.log(document.domain);

            // 7.获取页面来源url referrer 必须使用本地服务器

            console.log(document.referrer);

            // 8.获取页面中所有form

            console.log(document.forms);

            // 9.获取页面中所有img标签

            console.log(document.images);

            // 10.获取页面中所有带有href属性a标签

            console.log(document.links);

            // 文档中写入文本html表达式 js代码

            document.write('<div>我是一个div</div>');

获取元素的方法。————

 

                        ——

3.5.写入

document.write()

向文档写入文本或 HTML 表达式 或 JavaScript 代码。

<script>
  document.write("<p>Hello world!</p>");
  document.write("<span>Hello DOM!</span>");
  document.write("Hello Weekend!");
</script>

Element类型————

 

Text类型——

5.Text类型

Text 节点由 Text 类型表示，包含按字面解释的纯文本，也可能包含转义后的 HTML 字符，但不含 HTML 代码。

5.1.属性及方法

length

文本长度

appendData(text)

追加文本

deleteData(beginIndex,count)

删除文本

insertData(beginIndex,text)

插入文本

replaceData(beginIndex,count,text)

替换文本

splitText(beginIndex)

从beginIndex位置将当前文本节点分成两个文本节点

document.createTextNode(text)

创建文本节点，参数为要插入节点中的文本

substringData(beginIndex,count)

从beginIndex开始提取count个子字符串