2010-01-21 3 views
3

나는 HTML < 자바 스크립트 또는 jQuery를 사용하여 BR /> 태그를 후행 제거하는 가장 효율적인 방법에 대한 몇 가지 아이디어를 찾고 있어요.jQuery를/JS, 후행 html로 줄 바꿈을 트리밍/제거?

규칙 : 전면과 끝에서

  1. BR은 제거해야합니다.
  2. 그것은 비 폐쇄 및 자동 폐쇄 BR 태그를 제거해야합니다. 텍스트 내용에서
  3. 모든 BR은 그대로 유지해야합니다.

html로 :

<div class="generatedContent"> 
    <br>My awesome content. 
    <br><br>Some More awesome content. 
    <br> 
    <br> 
    <br>I still need the content written here<br/> 
    <br> 
    <br> 
    <br> 
    <br> 
    <br> 
    <br> 
</div> 



원하는 출력 :

<div class="generatedContent"> 
    My awesome content. 
    <br><br>Some More awesome content. 
    <br> 
    <br> 
    <br>I still need the content written here 
</div> 
+1

난 당신이 규칙 # 1, 나는 그것을 업데이트에 대해 이야기하고 생각하고 # 3 규칙 이동, 원하는 출력 헌터 @ 규칙 – hunter

+0

일치 표시되지 않습니다, 나는 그것이 더 많은 문법적 의미를 갖게한다고 믿는다. – Andrew

답변

4

대부분의 답변과 같이 왜 정규 표현식을 사용하고 싶은지 이해할 수 없습니다. DOM 방법을 사용하여 여기에 간단하다

function isBrOrWhitespace(node) { 
    return node && ((node.nodeType == 1 && node.nodeName.toLowerCase() == "br") || 
      (node.nodeType == 3 && /^\s*$/.test(node.nodeValue))); 
} 

function trimBrs(node) { 
    while (isBrOrWhitespace(node.firstChild)) { 
     node.removeChild(node.firstChild); 
    } 
    while (isBrOrWhitespace(node.lastChild)) { 
     node.removeChild(node.lastChild); 
    } 
} 

$(".generatedContent").each(function() { 
    trimBrs(this); 
}); 
1

이 시도 : FF와 IE7에서 작동하는 것 같다

var everything = $('.generatedContent').contents(); 
for(var i=everything.length-1;i>0;i--) 
{ 
    if((everything.get(i).tagName == 'BR' 
      && everything.get(i-1).tagName == 'BR') 
     || (everything.get(i).textContent.match(/\w/)==null)) 
     $(everything.get(i)).remove(); 
    else 
     break; 
} 

, 내가 노력했다고.

+0

행에있는 유일한 것이면 이것이 img 태그를 지우는 것 같습니다 : – Andrew

1

아마 개선 될 수 있지만, 그것을 작동합니다 :

$('.generatedContent').each(function() { 
    var str = $(this).html(); 
    var regex1 = /^([\n ]*)(<br.*?>)*/; 
    var regex2 = /(<br.*?>)*([\n ]*)$/; 
    str = str.replace(regex1,''); 
    str = str.replace(regex2,''); 
    $(this).html(str); 
}) 
0

아주 간단합니다.

s = s.replace(/^(\s*<br\s*\/?>)*\s*|\s*(<br\s*\/?>\s*)*$/g, '') 

아마 순수 JS를 사용하여 할 수있는보다 효율적인 방법이있다, 그러나 이것은 아마 더 간결입니다 : 다음 정규식을 적용 DIV generatedContent의 HTML을 가져 가라.

0

다음은 Firefox에서 저에게 적합한 정규 표현식 솔루션입니다. 아마 더 나은 가장자리 케이스 처리를 사용할 수 있었지만 아이디어는 효과가 있습니다. 기본적으로는 첫 번째와 마지막 비어 있지 않은 텍스트 노드를 찾아 전후 모든 노드를 제거합니다.

var firstValidTextNode = -1; 
var lastValidTextNode = -1; 
$('.generatedContent').contents().each(function(index){ 
    if (this.nodeType != 1 && $.trim($(this).text()).length) { 
     if (firstValidTextNode == -1) firstValidTextNode = index; 
     lastValidTextNode = index; 
    } 
}); 

if (lastValidTextNode != -1 && firstValidTextNode != -1) 
    $('.generatedContent').contents().slice(0, firstValidTextNode).remove().end().slice(lastValidTextNode + 1).remove(); 
관련 문제