Выберите текст из DIV - не очевидный способ

Question

Вот мой ДИВ:

<div id="myDiv">The 
<span class="cordial-err-corr" id="good0-0" data-original-title="" title="">best</span> 
way to receive congrats 
<span> 
    <span class="cordial-err-corr" id="good0-1" data-original-title="" title="">are</span> 
    <div class="btn-group"> 
    <a class="btn btn-mini dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a> 
    <ul class="dropdown-menu"> 
     <li><a class="prop0-1">is</a></li> 
     <li><a class="prop0-1">are</a></li> 
    </ul> 
    </div> 
</span> to give a correct answer.</div> 

Я хотел бы получить этот текст: «Самым лучшим способом получить поздравляю буду дать правильный ответ.»

Поэтому я звоню $('#myDiv').text(). Он не работает, так как я получаю два элемента в ul.dropdown-menu.

Следующим шагом является фильтрация или удалить не-хочет детей, то есть:

<div class="btn-group"> 
    <a class="btn btn-mini dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a> 
    <ul class="dropdown-menu"> 
    <li><a class="prop0-1">is</a></li> 
    <li><a class="prop0-1">are</a></li> 
    </ul> 
</div> 

Я пытался играть с $ .filter или $ .not или $ .children с JQuery селекторы и т.д. I не может найти правильный способ сделать это. Нужна помощь!

Вы можете найти код в jsfiddle: http://jsfiddle.net/Ku7FY/

[EDIT] Одно из решений предлагает этот код:

$('#result').append($('#myDiv').text().replace($(".btn-group").text(),"")).append('<br />') 

Если несколько div.btn-group существует, просто цикл, как:

var result = $('#myDiv').text(); 
$(".btn-group").each(function() { 
    result = result.replace($(this).text(),""); 
}); 
$('#result').append(result).append('<br />') 

Answer 1

Итак, если я получу это прямо, вы хотите исключить список из м .text(). Попробуйте что-то вроде:

$('#result').append($('#myDiv').text().replace($(".dropdown-menu").text(),"")).append('<br />') 

Answer 2

Попробуйте

function process(el){ 
    var array = []; 
    $(el).contents().each(function(){ 
     var $this = $(this), text; 
     if(this.nodeType == 3){ 
      text = $.trim($this.text()); 
      if(text){ 
       array.push(text) 
      } 
     } else if($this.is(':not(.btn-group)')){ 
      Array.prototype.push.apply(array, process(this)) 
     } 
    }) 
    return array; 
} 

console.log(process($('#myDiv')).join(' ')) 

Демо: Fiddle

Answer 3

Если вы не против размещения все «немой» текст в пролетах, то вы можете сделать это очень просто только захват «немых» текстовых пространств и «.cordial-err-corr» охватывает (и find()).

<div class="well" id="myDiv"><span class="cordial-content">The </span> 
<span class="cordial-err-corr" id="good0-0" data-original-title="" title="">best </span> 
<span class="cordial-content">way to receive congrats </span> 
<span> 
    <span class="cordial-err-corr" id="good0-1" data-original-title="" title="">are </span> 
    <div class="btn-group"> 
    <a class="btn btn-mini dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a> 
    <ul class="dropdown-menu"> 
     <li><a class="prop0-1">is</a></li> 
     <li><a class="prop0-1">are</a></li> 
    </ul> 
    </div> 
</span> <span class="cordial-content">to give a correct answer. </span></div> 

и

$('#myDiv').find('.cordial-err-corr,.cordial-content').text() 

Демо: Fiddle

Answer 4

я некрасивый, хотя достаточно просто (я думаю) метод:

Мы можем сделать копию, а затем удалить РОМ элементы, которые мы не хотим отображать. Затем мы можем получить желаемый текст.

var clone_div = $('#myDiv').clone(); 
clone_div.find('.btn-group').remove(); 
$('#result').append(clone_div.text()).append('<br />'); 

Это jsfiddle. http://jsfiddle.net/Ku7FY/4/