day9 part1：JavaScript DOM编程学习笔记02

五、读写属性节点

获取属性节点：1.直接通过cityNode.id这样的方式来获取和设置属性节点的值

              2.通过元素节点的getAttributeNode方法来获取属性节点，然后再通过nodeValue读写属性值。

读写属性节点：通过元素节点 . 的方式来获取属性值和设置属性值。

属性节点即为某一指定的元素节点的属性。

步骤：1.获取指定的那个元素节点

2.再读取指定属性的值

3.设置指定属性的值

window.οnlοad=function(){
              //属性节点即为某一指定的元素节点的属性
              //1.获取指定的那个元素节点
              var nameNode=document.getElementById("name");
              //2.再读取指定属性的值
              alert(nameNode.value);
              //3.设置指定属性的值
              nameNode.value="张三";

六、获取元素节点的子节点

注意：只有元素节点才有子节点

1.childNodes属性获取全部的子节点，该方法不实用，因为如果要获取指点节点的子节点的集合，可以直接调用元素节点的getElementByTagName()方法来获取。

2.firstChild属性获取第一个子节点

3.lastChild属性获取最后一个子节点

window.οnlοad= function(){
       var cityNode =document.getElementById("city");
       //2. 利用元素节点的 childNodes 方法可以获取指定元素节点的所有子节点.
       //但该方法不实用.
       alert(cityNode.childNodes.length);
       //3. 获取 #city 节点的所有 li 子节点.
       var cityLiNodes =cityNode.getElementsByTagName("li");
       alert(cityLiNodes.length);
       //4. 获取指定节点的第一个子节点和最后一个子节点.
       alert(cityNode.firstChild);
       alert(cityNode.lastChild);
}

七获取文本节点

步骤：元素节点—>获取元素节点的子节点

若元素节点只有文本节点一个子节点，

例如<liid=”bj” name=”Beijing”>北京</li>，<p>你喜欢哪个城市？</p>

可以先获取到指定节点的元素节点eleNode，然后利用eleNode，firstChild，nodeValue的方法来读写其文本节点的值。

window.οnlοad=function(){
              //文本节点一定是元素节点的子节点
              //1.获取文本节点所在的元素节点
              varbjNode=document.getElementById("bj");
              //2.通过firstchild定义到文本节点
              var bjTextNode=bjNode.firstChild;
              //3.通过操作文本节点的nodeValue属性来读写文本节点的值
              alert(bjTextNode.nodeValue);
              bjTextNode.nodeValue="尚硅谷";
              //alert(bjTextNode);
       }