摘要:對(duì)象提供了屬性用于實(shí)現(xiàn)獲取或設(shè)置頁面指定元素的代碼。需要說明的是,在上述語法結(jié)構(gòu)中,調(diào)用屬性的表示元素節(jié)點(diǎn)。但需要注明作者及來源,并且不能用于商業(yè)。本教程采用知識(shí)共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進(jìn)行許可。
Element 對(duì)象提供了 innerHTML 屬性用于實(shí)現(xiàn)獲取或設(shè)置 HTML 頁面指定元素的 HTML 代碼。
獲取 HTML 代碼innerHTML 屬性表示 HTML 頁面指定元素后代的 HTML 代碼,其語法結(jié)構(gòu)如下:
var content = element.innerHTML;
在上述語法結(jié)構(gòu)中,作為返回值 content 表示描述元素后代的 HTML 語句。
需要說明的是,在上述語法結(jié)構(gòu)中,調(diào)用 innerHTML 屬性的 element 表示元素節(jié)點(diǎn)。元素節(jié)點(diǎn)本身也是一個(gè)元素。
我們可以通過以下示例代碼,學(xué)習(xí)如何通過 innerHTML 屬性獲取指定元素的 HTML 語句:
var parent = document.getElementById("parent"); var content = parent.innerHTML; console.log(content);設(shè)置 HTML 代碼
innerHTML 屬性不僅提供了獲取 HTML 頁面中指定元素的后代 HTML 語句,還提供了設(shè)置 HTML 頁面中指定元素的后代 HTML 語句。其語法結(jié)構(gòu)如下:
element.innerHTML = markup;
在上述語法結(jié)構(gòu)中,markup 表示設(shè)置描述元素后代的 HTML 語句。
我們可以通過以下示例代碼,學(xué)習(xí)如何通過 innerHTML 屬性設(shè)置指定元素的 HTML 語句:
var parent = document.getElementById("parent"); parent.innerHTML = "";不是 W3C 規(guī)范
盡管 innerHTML 屬性不屬于 W3C DOM 規(guī)范,但是它為完全替換元素內(nèi)容提供了一個(gè)更加便捷的方式。
舉個(gè)例子,可以通過如下代碼完全刪除文檔內(nèi)body的內(nèi)容:
document.body.innerHTML = "";
值得注意的是: 因?yàn)?innerHTML 屬性沒有統(tǒng)一的標(biāo)準(zhǔn),各瀏覽器廠商對(duì)它實(shí)現(xiàn)差別很大。
本教程免費(fèi)開源,任何人都可以免費(fèi)學(xué)習(xí)、分享,甚至可以進(jìn)行修改。但需要注明作者及來源,并且不能用于商業(yè)。
本教程采用知識(shí)共享署名-非商業(yè)性使用-禁止演繹 4.0 國際許可協(xié)議進(jìn)行許可。
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/87320.html
摘要:系列教程是一套免費(fèi)開源,任何人都可以免費(fèi)學(xué)習(xí)分享,甚至可以進(jìn)行修改。本文是這套系列教程的索引也就是目錄第一回介紹在最開始,我們先來了解是什么的作用,以及瀏覽器的支持是怎么樣的。 《EASYDOM》系列教程是一套免費(fèi)、開源,任何人都可以免費(fèi)學(xué)習(xí)、分享,甚至可以進(jìn)行修改。但需要注明作者及來源,并且不能用于商業(yè)。 本文是這套系列教程的索引(也就是目錄): 第一回 DOM 介紹 在最開始,我...
摘要:而標(biāo)準(zhǔn)規(guī)范中提供了對(duì)象,主要是依靠元素樹結(jié)構(gòu)訪問和更新頁面的內(nèi)容。值得注意的是所有的頁面的元素都是對(duì)象,而這個(gè)對(duì)象又是繼承于對(duì)象的。我們可以簡(jiǎn)單地理解對(duì)象是對(duì)象的補(bǔ)充。本教程采用知識(shí)共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進(jìn)行許可。 DOM 的標(biāo)準(zhǔn)規(guī)范中提供了 Element 對(duì)象,該對(duì)象提供了 HTML 頁面中所有元素所具有的屬性和方法。 我們都知道 DOM 標(biāo)準(zhǔn)規(guī)范中提供了 Nod...
摘要:對(duì)象提供了可以創(chuàng)建元素節(jié)點(diǎn)屬性節(jié)點(diǎn)和文本節(jié)點(diǎn)的方法,方便更新頁面中的元素。是返回值,表示創(chuàng)建的元素。最后,通過方法創(chuàng)建屬性節(jié)點(diǎn),并設(shè)置了屬性值為,再將該屬性節(jié)點(diǎn)添加到新創(chuàng)建的元素中。 Document 對(duì)象提供了可以創(chuàng)建元素節(jié)點(diǎn)、屬性節(jié)點(diǎn)和文本節(jié)點(diǎn)的方法,方便 DOM 更新 HTML 頁面中的元素。 創(chuàng)建元素節(jié)點(diǎn) Document 對(duì)象提供了 createElement() 方法創(chuàng)建元...
摘要:元素之間的關(guān)系在元素樹結(jié)構(gòu)中,主要具有以下三層關(guān)系。祖先與后代如果我們將頁面中某一個(gè)元素作為祖先的話,那包含在該元素內(nèi)的所有元素除子級(jí)之外的都可以稱為該元素的后代。兄弟關(guān)系具有相同父級(jí)元素的兩個(gè)或幾個(gè)元素之間就是兄弟關(guān)系。 DOM 元素樹結(jié)構(gòu)與 DOM 節(jié)點(diǎn)樹結(jié)構(gòu)很相似,區(qū)別僅在于是利用節(jié)點(diǎn)解析 HTML 元素,還是利用元素解析 HTML 元素。 DOM 樹結(jié)構(gòu) 還記得下面這張圖嗎? ...
摘要:對(duì)象中提供了和分別可以用于獲取指定節(jié)點(diǎn)的節(jié)點(diǎn)名稱節(jié)點(diǎn)類型和節(jié)點(diǎn)的值。具體的語法結(jié)構(gòu)如下在上述語法結(jié)構(gòu)中,是一個(gè)整數(shù),其代表的是節(jié)點(diǎn)類型。本教程采用知識(shí)共享署名非商業(yè)性使用禁止演繹國際許可協(xié)議進(jìn)行許可。 Node 對(duì)象中提供了 nodeName、nodeType 和 nodeValue 分別可以用于獲取指定節(jié)點(diǎn)的節(jié)點(diǎn)名稱、節(jié)點(diǎn)類型和節(jié)點(diǎn)的值。 DOM 節(jié)點(diǎn)樹結(jié)構(gòu)中,我們實(shí)際開發(fā)最常見的節(jié)...
閱讀 2947·2021-11-11 10:58
閱讀 1996·2021-10-11 10:59
閱讀 3559·2019-08-29 16:23
閱讀 2422·2019-08-29 11:11
閱讀 2846·2019-08-28 17:59
閱讀 3930·2019-08-27 10:56
閱讀 2171·2019-08-23 18:37
閱讀 3169·2019-08-23 16:53