jQuery對元素內容操作

2021-07-30 10:37:19 字數 2172 閱讀 4187

jquery提供了對元素的內容和值進行操作的方法,其中,元素的值是元素的一種屬性,大部分元素的值都對應value屬性。下面我們再來對元素的內容進行介紹。

元素的內容是指定義元素的起始標記和結束標記中間的內容,又可分為文字內容和html內容。

那麼什麼是元素的文字內容和html內容?通過下面這段來說明。

測試內容

在這段**中,div元素的文字內容就是「測試內容」,文字內容不包含元素的子元素,只包含元素的文字內容。

而「測試內容

」就是元素的html內容,html內容不僅包含元素的文字內容,而且還包含元素的子元素。

一 對文字的內容操作

jquery

提供了text()

和 text(val)

兩個方法用於對文字內容操作,其中

text()

用於獲取全部匹配元素的文字內容,

text(val)

用於設定全部匹配元素的文字內容。

例如,在乙個

html

頁面中,包括下面

3 行**。

要獲取div

元素的文字內容,可以使用下面的**:

$("div").text();

得到的結果為:

2016-07-06星期三

13:20:10

text()方法取得的結果是所有匹配元素包含的文字組合起來的文字內容,這個方法也對xml文件有效,可以用text()方法解析xml文件元素的文字內容。

要重新設定div元素的文字內容,可以使用下面的**:

$("div").text("我是通過text()方法設定的文字內容");

這時,再應用「$("div").text();」獲取div元素的文字內容時,將得到以下內容:

我是通過

text()方法設定的文字內容

使用text()

方法重新設定

div元素的文字內容後,

div元素原來的內容將被新設定的內容替換掉,包括

html

內容。

例如,對下面的**

2011-07-06 

星期三

13:20:10

應用「 $("div").text("

我是通過

text()

方法設定的文字內容

");」設定值後,該

標記的內容將變為

我是通過

text()方法設定的文字內容

對html

內容操作

jquery提供了html()和html(val)兩個方法用於對html內容操作,其中html()用於獲取第乙個匹配元素的html內容,html(val)用於設定全部匹配元素的html內容。

例如,在乙個html頁面中,包括下面3行**。

要獲取div元素的html內容,可以使用下面的**:

alert($("div").html());

得到的結果如下圖

text()方法取得的結果是所有匹配元素包含的文字組合起來的文字內容,這個方法也對xml文件有效,可以用text()方法解析xml文件元素的文字內容。

要重新設定div元素的html內容,可以使用下面的**:

$("div").html("我是通過html()方法設定的html內容");

這時,再應用「$("div").html();」獲取div元素的html內容時,將得到下圖所示的內容。

方法與html(val)

不能用於

xml文件的

,但是可以用於

xhtml

文件。

大小: 7.7 kb

大小: 6.9 kb

JQuery獲取元素內容操作元素

獲取 設定元素內容體html 語法屬性名屬性說明 jquery物件.html 獲得內容體html 如果有標籤 一併獲得。jquery物件.html html 設定html 如果有標籤,將進行解析。你好 獲取 設定元素內容體純文字語法屬性名屬性說明 jq物件.text 獲得文字,如果有標籤,忽略。jq...

JQuery之五 操作元素內容

前面已經介紹了如何操作元素的properties attributes 以及 css styles,這節來看看如何操作元素的內容。獲取或替換html及text內容 1.使用html 方法 1 不帶引數的html 2 帶引數的html value 2.使用text 方法 1 不帶引數的text 2 t...

jQuery對元素 節點的操作

一 文字內容的操作 方法 text text val 例子 div div 獲取 div元素 console.log div.text 獲取文字內容 div.text aaaaa 設定了文字的內容 二 html內容的操作 html 用於獲取第乙個匹配元素的 html 內容 html val 用於設定...