//语法

elementNode.getAttribute(name)

//element（元素);Node(节点）

//注意：1. elementNode：使用getElementById()、getElementsByTagName()等方法，获取到的元素节点。2. name：要想查询的元素节点的属性名字

//例子

<p id="intro">课程列表</p>

    <ul>

        <li title="第1个li">HTML</li>

        <li>CSS</li>

        <li title="第3个li">JavaScript</li>

        <li title="第4个li">Jquery</li>

        <li>Html5</li>

    </ul>

<p>以下为获取的不为空的li标签title值:</p>

<script type="text/javascript">

    var con=document.getElementsByTagName("li");

    for (var i=; i< con.length;i++){

      var text=con[i].getAttribute("title");

      if(text!=null)

      {

        document.write(text+"<br>");

      }

    }

 </script>

//使用getAttribute()方法，获取LI标签的title值

//语法

elementNode.setAttribute(name,value)

//说明：1)name: 要设置的属性名。2)value: 要设置的属性值。3)把指定的属性设置为指定的值。如果不存在具有指定名称的属性，该方法将创建一个新属性。4)类似于getAttribute()方法，setAttribute()方法只能通过元素节点对象调用的函数。

//例子

<p id="intro">我的课程</p>
<ul>
    <li title="JS">JavaScript</li>
    <li title="JQ">JQuery</li>
    <li title="">HTML/CSS</li>
    <li title="JAVA">JAVA</li>
    <li title="">PHP</li>
</ul>
<h1>以下为li列表title的值,当title为空时，新设置值为"WEB前端技术":</h1>
<script type="text/javascript">
    var Lists=document.getElementsByTagName("li");
    for (var i=0; i<Lists.length;i++){
        var text=Lists[i].getAttribute("title");
        document.write(text +"<br>");
        if(text==""){
            Lists[i].setAttribute("title","前端技术");
            document.write(Lists[i].getAttribute("title")+"<br>");
        }
    }
</script>

//用getAttribute()方法获取元素属性值，保存在变量text。
//使用setAttribute()方法设置title属性值。

//例子

  <ul>

     <li>javascript</li>

     <li>HTML/CSS</li>

     <li>jQuery</li>

  </ul>

  <script type="text/javascript">

    var li=document.getElementsByTagName("li");

    for(var i=;i<li.length;i++){

       document.write("第"+i+"个节点的名称是"+li[i].nodeName+"<br  />");

       document.write("第"+i+"个节点的值是"+li[i].nodeValue+"<br  />");

       document.write("第"+i+"个节点的类型是"+li[i].nodeType+"<br  />");

    }

  </script>

//获取所有LI标签，并输出相应节点的名称、节点的值、节点的类型。

//访问父节点语法

elementNode.parentNode

//访问祖节点语法

elementNode.parentNode.parentNode

<div id="text">

  <p id="p">

    parentNode

    <span id="con"> 获取指点节点的父节点</span>

  </p>

</div>

<script type="text/javascript">

  var mynode= document.getElementById("con");

  var p=document.getElementById("p");

  document.write(mynode.parentNode.parentNode.nodeName);

  //获取父节点

  document.write(p.parentNode.nodeName);

  //获取祖节点

</script>

//运行结果

DIV

DIV

<script type="text/javascript">

   var body = document.body;

   var input = document.createElement("input");

   input.type = "button";

   input.value = "创建一个按钮";

   body.appendChild(input);

 </script> 

<script type="text/javascript">

   var body= document.body;

   var btn = document.createElement("input");

   btn.setAttribute("type", "text");

   btn.setAttribute("name", "q");

   btn.setAttribute("value", "使用setAttribute");

   btn.setAttribute("onclick", "javascript:alert('This is a text!');");

   body.appendChild(btn);

</script>