HTML DOM存取HTML元素的方法

getElementById()

#功能：尋找網頁中指定id的元素物件。
語法：var obj = document.getElementById(id)
參數：id是指網頁中標記的id屬性的值。
傳回值：傳回一個元素物件。
範例：var imgObj = document.getElementById(“img01”)

#getElementsByTagName(tagName)

#功能：尋找指定的HTML標記，傳回一個陣列。
語法：var arrObj = parentNode.getElementsByTagName(tagName)
參數：tagName是要尋找的標記名稱，不帶尖括號。
傳回值：傳回一個陣列。如果只有一個節點，也回傳一個陣列。
範例：var arrObj = ulObj.getElementsByTagName(“li”)

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
        <script type="text/javascript">
            window.onload = function(){
            //获取id=ulTag的网页对象
            var ulObj = document.getElementById("question");
            //查找<ul>下的所有的<li>标记
            var arrObj = ulObj.getElementsByTagName("li");
            //给所有的<li>标记增加CSS效果
            for(var i=0;i<arrObj.length;i++)
            {
                //给每个<li>标记加style属性
                arrObj[i].style = "color:blue;font-size:24px;";
            }
        }
        </script>
    </head>
    <body >
        <ul id="question">
            <li>mac 中系统自带的apache 误删了怎么恢复</li>
            <li>CURL POST数据量过大，接收不到服务端的信息</li>
            <li>用了构造函数为什么这个还是2？</li>
            <li>cookies登录原理</li>
        </ul>
</html>

繼續學習

新建檔案

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE HTML>
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 <title>php.cn</title>
 <script type="text/javascript">
 window.onload = function(){
 //获取id=ulTag的网页对象
 var ulObj = document.getElementById("question");
 //查找<ul>下的所有的<li>标记
 var arrObj = ulObj.getElementsByTagName("li");
 //给所有的<li>标记增加CSS效果
 for(var i=0;i<arrObj.length;i++)
 {
 //给每个<li>标记加style属性
 arrObj[i].style = "color:blue;font-size:24px;";
 }
 }
 </script>
 </head>
 <body >
 <ul id="question">
 <li>mac 中系统自带的apache 误删了怎么恢复</li>
 <li>CURL POST数据量过大，接收不到服务端的信息</li>
 <li>用了构造函数为什么这个还是2？</li>
 <li>cookies登录原理</li>
 </ul>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX