getElementsByName方法、getElementsByTagName方法、document对象三个查询方法的使用注意事项、dom对象查询练习、document对象补充说明

getElementsByName方法

    
    
    



    兴趣爱好：
    C
    java
    python
    

    全选
    全不选
    反选

 

 

 getElementsByTagName方法

    
    
    




        兴趣爱好：
        C
        java
        python
        

        全选

 document对象三个查询方法的使用注意事项

注意：document对象的三个查询方法，如果有id属性，优先使用getElementById方法进行查询，如果没有id属性，则优先调用getElementsByName方法来进行查询，如果id属性和name属性都没有，最后按标签名查getElementsByTagName

以上三个方法都要在加载完成之后执行，才能查询到标签对象

dom对象查询练习

节点就是标签对象，节点的常用属性和方法：

方法：

通过具体的元素节点调用:

getElemensByTagName()方法，获取当前节点的指定标签名孩子节点

appendChild(oChildNode)方法，可以添加一个子节点，oChildNode是要添加的孩子节点

属性：

childNodes属性：获取当前节点的所有子节点

firstChild属性：获取当前节点的第一个子节点

lastChild属性：获取当前节点的最后一个子节点

parentNode属性：获取当前节点的父节点

nextSibling属性：获取当前节点的下一个节点

previousSibling属性：获取当前节点的上一个节点

className属性：用于获取或设置标签的class属性值

innerHTML属性：表示获取/设置起始标签和结束标签中的内容

innerText属性：表示获取/设置起始标签和结束标签中的文本

   

      

         你喜欢哪个城市?
      

      

         
北京
         
上海
         
东京
         
首尔
      

      

      


      

         你喜欢哪款单机游戏?
      

      

         
红警
         
实况
         
极品飞车
         
魔兽
      

      

      


      

         你手机的操作系统是?
      

      
IOS
Android
Windows Phone
   

   

      gender:
      
      Male
      
      Female
      

      

      name:
      
   


   
查找#bj节点
   
查找所有li节点
   
查找name=gender的所有节点
   
查找#city下所有li节点
   
返回#city的所有子节点
   
返回#phone的第一个子节点
   
返回#bj的父节点
   
返回#android的前一个兄弟节点
   
返回#username的value属性值
   
设置#username的value属性值
   
返回#bj的文本值

document对象补充说明

document.createElement(tagName)方法：通过给定的标签名，创建一个标签对象，tagName是要创建的标签名

appendChild(oChildNode)方法：可以添加一个子节点，oChildNode是要添加的孩子节点