jQuery-besøg - contents() metoden

Eksempel

Finder alle tekstnoder i afsnittet og indpakker dem med fed tekst.

$("p").contents().filter(function(){ return this.nodeType != 1; }).wrap("<b/>");

亲自试一试

Definition og brug

contents() metoden henter undernoderne for hver element i matchende elementkollektion, herunder tekst- og kommentarnoder.

Syntaks

.contents()

Detaljeret forklaring

Hvis der gives en jQuery-objekt, der repræsenterer en samling af DOM-elementer, giver .contents() metoden mulighed for at hente de direkte underordnet noder i DOM-træet for disse elementer og opbygge en ny jQuery-objekt med matchende elementer. .contents() og .children() 方法类似,不同的是前者在结果 jQuery 对象中包含了文本节点以及 HTML 元素。

.contents() 方法也可以用于获取 iframe 的内容文档,前提是该 iframe 与主页面在同一个域。

请思考下面这个带有一些文本节点的 <div>,每个节点被两个折行元素 (<br />) 分隔:

<div class="container">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
  do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
  <br /><br />
  Ut enim ad minim veniam, quis nostrud exercitation ullamco 
  laboris nisi ut aliquip ex ea commodo consequat.
  <br /> <br />
  Duis aute irure dolor in reprehenderit in voluptate velit 
  esse cillum dolore eu fugiat nulla pariatur.
</div>

我们可以使用 .contents() 方法来将文本块转换为格式良好的段落:

$('.container').contents().filter(function() {
  return this.nodeType == 3;
)
  .wrap('<p></p>')
.end()
.filter('br')
  .remove();

亲自试一试

此代码首先接收 <div class="container"> 的内容,然后过滤其文本节点,将文本节点封装入段落标签中。这是通过测试元素的 .nodeType 属性实现的。该属性包含指示节点类型的数字代码;文本节点使用代码 3。内容会被再次过滤,这次针对 <br /> 元素,这些元素会被移除。