51

JavaScript を使用して検出する方法

<br>
<br>
<br>

一つになる

<br>

?

私は試しました:

jQuery('body').html().replace(/(\<br\>\r\n){3, }/g,"\n");

しかし、これは私にとってはうまくいきません。

4

9 に答える 9

172

CSS ソリューション

ページ上の複数の効果を無効にしたい場合は<br>、JavaScript を使用せずに CSS で行うことができます。

br + br { display: none; }

ただし、この方法は、次のようなタグを操作する場合に理想的です。

<div>Text</div><br /><br /><br />
<div>Text</div><br /><br /><br />
<div>Text</div><br /><br /><br />

その他の場合は、次のようになります。

Hello World<br />   <br />
Hello World<br />   <br />
Hello World<br />   <br />

これは失敗します (CSS がテキスト ノードを渡すため)。代わりに、JavaScript ソリューションを使用してください。


JavaScript ソリューション

// It's better to wait for document ready instead of window.onload().
window.onload = function () {
    // Get all `br` tags, defined needed variables
    var br = document.getElementsByTagName('br'),
        l = br.length,
        i = 0,
        nextelem, elemname, include;
        
    // Loop through tags
    for (i; i < l - 1; i++) {
        // This flag indentify we should hide the next element or not
        include = false;
        
        // Getting next element
        nextelem = br[i].nextSibling;
        
        // Getting element name
        elemname = nextelem.nodeName.toLowerCase();
        
        // If element name is `br`, set the flag as true.
        if (elemname == 'br') {
            include = true;
        }
        
        // If element name is `#text`, we face text node
        else if (elemname == '#text') {
            // If text node is only white space, we must pass it.
            // This is because of something like this: `<br />   <br />`
            if (! nextelem.data.replace(/\s+/g, '').length) {
                nextelem = br[i+1];
                include = true;
            }
        }
        
        // If the element is flagged as true, hide it
        if (include) {
            nextelem.style.display = 'none';
        }
    }
};
于 2013-06-12T09:26:24.873 に答える
1

このようなものは正しいアプローチではないでしょうか:

$("br~br").remove()

編集: いいえ、違います。BoltClock によると、「連続」の定義が緩すぎるためです。

于 2013-06-12T13:15:49.273 に答える
1

このソリューションは jQuery + DOM のみであり、HTML を文字列として操作せず、テキスト ノードで動作し、空白のみのテキスト ノードを無視します。

$('br').each(function () {
  const {nodeName} = this;

  let node = this;

  while (node = node.previousSibling) {
    if (node.nodeType !== Node.TEXT_NODE || node.nodeValue.trim() !== '') {
      break;
    };
  }

  if (node && node !== this && node.nodeName === nodeName) {
    $(node).remove();
  }
});

参照: https://jsfiddle.net/kov35jct/

于 2017-11-15T11:40:00.807 に答える
0

これを試して

$('body').html($('body').html().replace(/(<br>)+/g,"<br>"));

n 個の<br>を 1 個に置き換えます。

デモ

于 2013-06-12T09:43:50.823 に答える
0

私はこれで行きます:

$('body').html($('body').html().replace(/<br\W?\\?>(\W?(<br\W?\\?>)+)+/g,"<br>"));

ただし、ここの別の投稿のコメントを読んだ後、バックエンドで修正できる場合に備えて、これを避けるようにしてください.

于 2013-06-18T20:14:50.447 に答える
-1

これを試して:

jQuery('body').html(
      jQuery('body').html().replace(/(?:<br>\s+){3,}/ig,"\n"));
);

デモ: jsfiddle

于 2013-06-12T09:24:52.910 に答える