如何使用javascript删除行尾的<br>

Question

如何使用javascript删除行尾的br标签？

<code>
line 1 <br>
line 2 <Br>
line 3 <br />
line 4 <br/>
</code>

Answer 1

这将删除最后br在第一个 code页面上的元素:

var code = document.querySelector('code');
var brs = code.querySelectorAll('br');
var br = brs.length && brs[brs.length-1];
if (br) {
    br.parentNode.removeChild(br);
}

实例:

setTimeout(function() {
  var code = document.querySelector('code');
  var brs = code.querySelectorAll('br');
  var br = brs.length && brs[brs.length-1];
  if (br) {
    br.parentNode.removeChild(br);
  }
}, 500);

<code>
line 1 <br>
line 2 <Br>
line 3 <br />
line 4 <br/>
</code>Text after so you can see it when it goes

querySelector并且querySelectorAll都采用CSS风格的选择器.它们在所有现代浏览器和IE8上都得到了支持.querySelector返回文档中的第一个匹配元素(如果有),或者null如果没有则返回.querySelectorAll返回匹配元素的列表(可能为空,因此上面的检查).

上面还使用了JavaScript奇特强大的&&操作员,这是一个奇怪的强大||操作员的堂兄; 我的博客上的这篇文章解释了他们两个.

当然,如果您需要更具体地了解code您正在处理的元素,请相应地调整第一个选择器.

如果你使用jQuery,它有点简单:

$("code").first().find("br").last().remove();

实例:

setTimeout(function() {
  $("code").first().find("br").last().remove();
}, 500);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<code>
line 1 <br>
line 2 <Br>
line 3 <br />
line 4 <br/>
</code>Text after so you can see it when it goes