子要素のコンテンツを持たないコンテンツを取得する

Question

「スパン」コンテンツなしで「li」テキストを取得するにはどうすればよいですか？

HTML

<ul class="texts"> 
    <li>jimbo <span>Add text</span></li> 
    <hr /> 
    <li>mary jane <span>Add text</span></li> 
    <hr /> 
    <li>bill clinton <span>Add text</span></li> 
</ul> 

JS：

$(document).on('click','.texts li span',function() {  
     var current_content = $("#addReply textarea").val(); 
     var chosen_content = $(this).parent("li").html(); 
     $("#addReply textarea").val(current_content + "\n" + chosen_content) 
}); 

Answer 1

を内容なしちょうどクリックしたスパン[htmlとは違って、[セット内の最初のエントリのHTMのみを返す]]と同じように、contentsとnot（htmlではなくtext）を使用できます。 ：

var chosen_content = $(this).parent("li").contents().not(this).text(); 

例：

$(document).on('click', '.texts li span', function() { 
 
    var current_content = $("#addReply textarea").val(); 
 
    var chosen_content = $(this).parent("li").contents().not(this).text(); 
 
    $("#addReply textarea").val(current_content + "\n" + chosen_content) 
 
});

<ul class="texts"> 
 
    <li>jimbo <span>Add text</span> 
 
    </li> 
 
    <hr /> 
 
    <li>mary jane <span>Add text</span> 
 
    </li> 
 
    <hr /> 
 
    <li>bill clinton <span>Add text</span> 
 
    </li> 
 
</ul> 
 
<div id="addReply"> 
 
    <textarea cols=40 rows=5></textarea> 
 
</div> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 2

その後、spanを削除、親要素のクローンを作成し、最終的にコンテンツを取得することができます：あなたがしたい場合

var foo = $(this).parent("li").clone(); 
foo.find('span').remove(); 
var content = foo.text();