Question

如果我这样做，以下情况很好：

<div id="results">
  <p>Hello<br>there</p>
</div>

$($("#results p").children('br').get(0).nextSibling).remove();

我得到：hello

但如果我这样做：

<th class="infobox">Head</th>
<td>Hello<br>there</td>

var newLineRemove = $(".infobox td").children('br').get(0).nextSibling();
$wikiDOM.find(newLineRemove).remove();

给我

未捕获的TypeError：无法读取属性＆＃39; nextSibling＆＃39;未定义的

Answer 1

这是因为.get(...)返回一个DOM元素而不是一个jQuery对象。在第一个示例中，您使用$(...)将该DOM元素转换为jQuery对象，但在第二个示例中您没有这样做。

这会将DOM元素转换为jQuery元素并消除错误

var newLineRemove = $($(".infobox td").children('br').get(0).nextSibling);

但它不会做你想做的事，因为@ Forty3说“<td>不在..infobox”

这似乎有效，但我可能会把事情变得更复杂，然后他们必须：

$(function(){
  var td = $(".infobox").next();
  if(td.find("br").length){
    $(td.contents().get().reverse()).each(function(){
      $(this).remove();
      if(this.tagName == "BR"){
        return false;
      }
    });
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<th class="infobox"></th>
<td>Hello<br>there</td>
</table>

Answer 2

我是最简单的解决方案，试试这个：

＆＃13;

$('td').each(function() {
  $(this).html($(this).html().split('<br>')[0]);
});

＆＃13;

li {
  margin-bottom: 10px;
}

#usp-custom-3 {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<table>
  <tr>
    <th class="infobox"></th>
  </tr>
  <tr>
    <td>Hell
      <br>there</td>

  </tr>
  <tr>
    <td>Hello
      <br>there<br>there</td>

  </tr>
</table>

＆＃13;

Answer 3

您的代码无效，因为".infobox td"选择器正在 .infobox元素中寻找td元素，但在您的HTML中，td紧跟在.infobox。

如果你想要的东西与你现有的JS非常相似但是使用那个HTML（注意到td和th元素需要在表格中的tr内）你可以这样做：

＆＃13;
＆＃13;
$($(".infobox").next().children("br")[0].nextSibling).remove()
＆＃13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <table> <tr> <th class="infobox"></th> <td>Hello<br>there</td> </tr> </table>
＆＃13;
＆＃13;
＆＃13;

也就是说，使用.next()获取.infobox之后的元素，获取元素的子元素元素，取第一个元素＆＃39; s .nextSibling，然后将其包装在jQuery对象中，以便您可以调用.remove()。

编辑：请注意，如果有多个具有相似元素的行，则上述代码仅在第一个代码上执行删除操作。如果是我的代码，我可能会选择所有相关元素，然后更新他们的HTML更像这样：

$(".infobox").next("td").html(function(i, h) { return h.split('<br>')[0] })

如何删除<br/>之后的一切？

3 个答案: