HTML-Javascript 方法

| | | | | | | | | | | | | | | | | | | | | | | | | | | | | |

jQuery 提供了許多方法來幫助開發人員有效地創建動態 Web 體驗。 jQuery html () 方法替換所選元素中的所有 HTML。如果您想動態更改用戶在與頁面交互後看到的內容,這將非常有用。

在本指南中,我們將學習如何使用 html () 和它的語法。我們還將逐步介紹如何使用 html ()。 jQuery html() 是jQuery 庫的基礎方法,經常被使用。學完基礎知識後,就可以開始練習html()了。

什麼是jQuery html()?

jQuery html() 將每個元素的 HTML 內容設置為一組匹配的元素。應注意提供足夠精確的查詢,以便僅替換您想要的 HTML。

僅使用 html () 編輯內容。如果有樣式表,則新內容將與之前的內容具有相同的樣式。還值得一提的是,html () 僅適用於 HTML 文檔 - 它不適用於 XML。

html () jQuery 語法

請記住jQuery 方法首先在選擇器上調用。選擇器可以像

標記一樣大,也可以像帶有標識符 () 的

假設我們有這個簡單的

我們可以替換整個

tag:

上面的代碼將新的 HTML 顯示為:

如果有是與原始

tag 關聯的樣式,它將不再與新內容一起使用。也可以傳遞一個簡單的字符串:

我們的代碼 HTML 現在如下:

我們可以看到新內容有一些不同。傳遞文字字符串是保持先前內容樣式的好方法。請記住,文字字符串只是包含字符的字符串。如果新內容是子元素,使用 HTML 字符串可以做到這一點。

現在基本語法已經講完了,我們來看一個例子。

p>

jQuery html() 示例

我們已經看到 html() 如何在我們的“新內容”示例中替換所選元素中的內容。這可以通過將文字字符串或 HTML 字符串作為參數傳遞來實現。我們來看一個保持原有樣式的例子。

查看我們最初的 HTML 頁面,我們只會看到藍色的“Hello”這個詞。

在這個例子中,我們想要用新的內容替換“你好”這個詞,同時保持原有的風格。為此,我們選擇名稱為藍色類的段落。

我們選擇了屬於藍色類的段落並將“Hello”替換為“Hello AGAIN”。由於 html() 替換了元素名稱中包含的內容,所以會保留藍色。

< Figure class = “WP-圖像塊”>

如果我們想要什麼替換段落中的所有文本?如果我們選擇

元素,它會將上面的文本替換為“Hello AGAIN”的三個實例。 ‚"

這裡我們選擇HTML文件中的整段標籤,並將每個標籤的內容替換為“你好AGAIN”。或放置信封內容PE在這些標記。

<人物類=“WP-圖像塊”>

正如我們希望的那樣。讓我們去上一級在我們選擇我們的

屬於`主`類,這是通過它在哪裡有用的HTML字符串作為參數。

指南 學習 HTML 以了解有關上述內容的更多信息

En 一行代碼,我們已經替換了三個不同的段落元素並使用了我們自己的原始類樣式。

結論

jQuery html() 是一種常用的方法來替換 HTML 頁面的內容以創建動態體驗。 e html () 替換 HTML 元素中包含的內容,注意 jQuery 選擇器和样式類很重要。這將防止任何不必要的樣式更改。

我們了解了 jQuery 是什麼,它的語法和使用示例。花時間練習和開發這種廣泛使用的方法。