如何使用jQuery获得元素的文本兄弟

How to get text sibling of element using jQuery?

本文关键字：文本 兄弟 元素 何使用 jQuery      更新时间：2023-09-26

我正在抓取一个网站，我发现了这个

<table>
  <tr>
    <td>
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

如何分别得到status, type和added ?

我知道我会得到否定，因为我没有发布任何尝试过的代码…但我甚至不知道该尝试什么!

这个网站有很差的HTML结构，我似乎找不到任何方法。

  • 使用jQueryElement.text()抓取所有文本。
  • 使用String#spplit分割字符串

var text = $('#content').text();
var split = text.trim().split(''n');
split.forEach(function(el) {
  var splitAgain = el.split(':');
  console.log("Key:  " + splitAgain[0].trim() + "   Value:  " + splitAgain[1].trim());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table>
  <tr>
    <td id="content">
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

Javascript nextSibling属性获取元素的下一个文本兄弟。您可以在td中选择b元素，并获得它的下一个文本。

$("td > b").each(function(){	
    console.log(this.innerText +" = "+ this.nextSibling.nodeValue.trim());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <b>Status:</b>ACTIVE;
      <b>Type:</b>CN - CONSTRUCTION
      <b>Added:</b>02/24/2012
    </td>
  </tr>
</table>

相关文章：