JavaScript駕馭網(wǎng)頁-獲取網(wǎng)頁元素

字號:


    利用DOM分割HTML
    利用JavaScript控制網(wǎng)頁內(nèi)容其實很像烹飪。只是不用收拾列羹剩肴,但也沒有辦法享受美味的成果。
    不過,你將能完整網(wǎng)頁內(nèi)容的HTML構(gòu)成要素:更重要的是,你將擁有替換網(wǎng)頁成分的能力。
    JavaScript讓你可以隨心所欲地操控網(wǎng)頁的HTML代碼,從而打開各種有趣的機會之門,一切都是因為標準對象:DOM的存在
    getElementById
    HTML標簽都有一個"id"屬性,第個標簽的該屬性都是獨一無二的
    可以通過id屬性來獲取元素
    <body>
    <div id="div1">
    <div id="div2">
    內(nèi)容
    </div>
    </div>
    </body>
    var sceneDesc=document.getElementById("div2");
    getElementById可以通過元素的id屬性去訪問標簽
    括號里是id的值
    getElementsByTagName
    也可以通過標簽名來獲取元素
    <body>
    <div id="div1">
    <div id="div2">
    <div id="div3">
    內(nèi)容
    </div>
    </div>
    </div>
    </body>
    var divs=document.getElementsByTagName("div");
    getElementsByTagName返回所有div標簽,結(jié)果是一個數(shù)組,結(jié)果按照標簽在HTML中的順序排列
    括號里是標簽名
    var divs=document.getElementsByTagName("div")[2];
    用索引獲取第三個div標簽
    innerHTML
    innerHTML特性對所有存儲在元素里的內(nèi)容提供了訪問管道
    通過innerHTML訪問元素內(nèi)存儲的內(nèi)容:
    <div id="div1">
    <p id="story"> you are standing</p>
    <strong>alone</strong> in the woods.
    </div>
    </body>
    document.getElementById("story").innerHTML;
    返回的內(nèi)容是: you are standing alone in the woods.
    innerHTML獲取的是指定元素下的所有內(nèi)容與標簽
    innerHTML也能用于設置網(wǎng)頁內(nèi)容
    document.getElementById("story").innerHTML="You are <strong>not</strong> alone!";
    innerHTML只用來設置可以包含文本的標簽
    有關JavaScript駕馭網(wǎng)頁-獲取網(wǎng)頁元素的知識就給大家介紹這么多,希望對大家有所幫助!