2016-09-15 1 views
0

JavaScriptでチェリオを使用してテキスト領域を選択します:私は選択し$('div.A').text()を使用する場合ははどのように私は例

<div class="A"> 
    I'm in A. 
    <h1 class="B"> 
      I'm in A and B.   
    </h1> 
    I'm in A, too. 
</div> 

、私はまた、I'm in A and Bを取得します。しかし、私はちょうどI'm in AI'm in A, tooを得たいです。私が望む部品を選択するにはどうすればいいですか? .textを使用しての代わりに

答えて

1

、それらを介してループにeachを使用し、唯一のテキストノードのテキストを取得し、その後、(テキストノードを含む)の全てのノードを取得するには.contentsを使用します。

var text = []; 
$("div.A").contents().each(function() { 
    if (this.nodeType === 3) { // 3 = Text node 
     text.push(this.nodeValue); 
    } 
}); 

console.log(text); // ["I'm in A.", "I'm in A, too."] 

(その空白がテキストノードであるように、実際のログインの内容は、おそらく正確なマークアップに応じて、それらの周りの空白を持つことになります)

それとも好む場合:。

ES2015 +にたくさん整然と見えます

let text = $("div.A") 
    .contents() 
    .filter((i, e) => e.nodeType === 3) 
    .map((i, e) => e.nodeValue) 
    .get(); 
2

この単純なトリックは、あなたが望む結果を得るに役立つだろう。

$('div.A') 
    .clone() //clone the element 
    .children() //select all the children 
    .remove() //remove all the children 
    .end() //again go back to selected element 
    .text(); 

クローン法に基づいて、その、あなたはそれfrom hereについての詳細を読むことができます。

$('div.A').clone().children().remove().end().text() //single line representation