JavaScript駕馭網頁-獲取網頁元素
來源:易賢網 閱讀:723 次 日期:2016-07-16 13:37:50
溫馨提示:易賢網小編為您整理了“JavaScript駕馭網頁-獲取網頁元素”,方便廣大網友查閱!

利用DOM分割HTML

利用JavaScript控制網頁內容其實很像烹飪。只是不用收拾列羹剩肴,但也沒有辦法享受美味的成果。

不過,你將能完整網頁內容的HTML構成要素:更重要的是,你將擁有替換網頁成分的能力。

JavaScript讓你可以隨心所欲地操控網頁的HTML代碼,從而打開各種有趣的機會之門,一切都是因為標準對象:DOM的存在

getElementById

HTML標簽都有一個"id"屬性,第個標簽的該屬性都是獨一無二的

可以通過id屬性來獲取元素

<body>

<div id="div1">

<div id="div2">

內容

</div>

</div>

</body>

var sceneDesc=document.getElementById("div2");

getElementById可以通過元素的id屬性去訪問標簽

括號里是id的值

getElementsByTagName

也可以通過標簽名來獲取元素

<body>

<div id="div1">

<div id="div2">

<div id="div3">

內容

</div>

</div>

</div>

</body>

var divs=document.getElementsByTagName("div");

getElementsByTagName返回所有div標簽,結果是一個數組,結果按照標簽在HTML中的順序排列

括號里是標簽名

var divs=document.getElementsByTagName("div")[2];

用索引獲取第三個div標簽

innerHTML

innerHTML特性對所有存儲在元素里的內容提供了訪問管道

通過innerHTML訪問元素內存儲的內容:

<div id="div1">

<p id="story"> you are standing</p>

<strong>alone</strong> in the woods.

</div>

</body>

document.getElementById("story").innerHTML;

返回的內容是: you are standing alone in the woods.

innerHTML獲取的是指定元素下的所有內容與標簽

innerHTML也能用于設置網頁內容

document.getElementById("story").innerHTML="You are <strong>not</strong> alone!";

innerHTML只用來設置可以包含文本的標簽

有關JavaScript駕馭網頁-獲取網頁元素的知識就給大家介紹這么多,希望對大家有所幫助!

更多信息請查看網絡編程
易賢網手機網站地址:JavaScript駕馭網頁-獲取網頁元素

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網站聲明 | 網站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網