使用jquery基于<br/>标签拆分字符串

时间:2013-09-03 12:17:55

标签: javascript jquery

如何使用jquery拆分包含<br/>标记的字符串。我尝试了以下代码,但它在控制台中出错。我不确定如何根据<br/>标签拆分字符串这是我试过的代码

jQuery(document).ready(function($)
    {
        var lines = jQuery('this is for testing <br/> How are you<br/>').split('<br/>');
        jQuery.each(lines, function() {
            alert(this);
        });
    });

任何建议都会很棒。

10 个答案:

答案 0 :(得分:10)

你想拆分一个香草字符串,不要简单地将其传递给$();

jQuery(document).ready(function($)
    {
        var lines = 'this is for testing <br/> How are you<br/>'.split('<br/>');
        jQuery.each(lines, function() {
            alert(this);
        });
    });

答案 1 :(得分:8)

这里有很多重复的答案。这个是不同的。如果您可以保证<br/>标签的拼写,其他答案都可以。但是,如果您无法控制HTML,则换行标记可以采用不同的格式:

&LT峰; br /&GT;
&LT; BR /&GT;
&lt; br /&gt;
&LT峰; br&GT;
&lt; br&gt;
...等等。

主流浏览器都可以处理所有这些,但只有第一个浏览器将由建议的.split("<br/>")操作处理。更强大的选项是使用正则表达式来匹配标记:

jQuery(document).ready(function($)
{
    var brExp = /<br\s*\/?>/i;
    var lines = ("this is for testing <br/> How are you<BR />").split(brExp);
});

我已将表达式写成不区分大小写,在&#39;&lt; br&#39;之后允许任意数量的空格,以及&#39; /&#39;是可选的。

答案 2 :(得分:2)

尝试使用:

var exploded = lines.split('<br />'); 

更多信息here

答案 3 :(得分:2)

如果你尝试怎么办?

jQuery(document).ready(function($)
    {
        var lines = 'this is for testing <br/> How are you<br/>'.split('<br/>');
        each(lines, function() {
            alert(this);
        });
    });

答案 4 :(得分:1)

你不能只做这样的事情:

 var lines = 'this is for testing <br/> How are you<br/>'.split('<br/>');

如同你想要摆脱空元素一样,你可以过滤lines,如下所示:

// this will get rid of empty elements 
lines = lines.filter(function(n) { 
    return n; 
});

答案 5 :(得分:1)

jQuery(document).ready(function($)
{

var str = 'this is for testing <br/> How are you<br/>';
var lines = str .split('<br/>');
     jQuery.each(lines, function() {
        alert(this);
    });
});

答案 6 :(得分:1)

无需像jquery一样包装:

jQuery('this is for testing <br/> How are you<br/>').split('<br/>');

Can be like :

('this is for testing <br/> How are you<br/>').split('<br/>');

<强> DEMO

答案 7 :(得分:1)

试试这个

jQuery(document).ready(function($)
    {
        var lines = ('this is for testing <br/> How are you<br/>').split("<br/>");
        jQuery.each(lines, function() {
            alert(this);
        });
    });

Demo

答案 8 :(得分:1)

这是工作代码

jQuery(document).ready(function($)
    {

        var lines = 'this is for testing <br/> How are you<br/>'.split('<br/>');
                alert("workig");
        jQuery.each(lines, function() {
            alert(this);
        });
    });

答案 9 :(得分:1)

那不是jQuery解决方案,但希望有人会发现它有用。该函数返回一个或两个元素。

function splitContentsOnBr(el) {
    const before = document.createElement('div');
    const after = document.createElement('div');
    let found = false;
    el.childNodes.forEach(c => {
        if (found) {
            after.appendChild(c.cloneNode(true));
        } else if (c.tagName == 'BR') {
            found = true;
        } else {
            before.appendChild(c.cloneNode(true));
        }
    });
    return after.childNodes.length ? [before, after] : [before];
}
document.querySelector('#result').innerHTML = splitContentsOnBr(document.querySelector('h1'))
    .map(el => el.textContent.trim())
    .join(', ');
<h1>
  First part
  <br>
  Second part
</h1>
<div id="result">
</div>