獲取文本separetly

Question

我有以下HTML

<div> 
    <span>123</span> 
    <span>456<span>789</span></span> 
</div> 

當我試圖讓文本它提供了在同一行

$('div').text() ---> '123456789' 

問題：如何獲得文本separetly像：

123 456 789 

Answer 1

入住div每一個元素，若沒有孩子得到它的文本，如果有孩子，去它的孩子並獲得文本其中。

var text = ""; 
 
function getText(element){ 
 
    $(element).children().each(function(index){ 
 
     var child = $(this).children(); 
 
     \t if (child.length == 0) 
 
      \t text += "," + $(this).text().trim();   
 
     \t else { 
 
      text += "," + child[0].previousSibling.nodeValue.trim(); 
 
      getText(this); 
 
     } 
 
    }); 
 
} 
 

 
getText($("div")); 
 
console.log(text);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <span>123</span> 
 
    <span> 
 
     456 
 
     <span>789</span> 
 
    </span> 
 
</div>

Answer 2

要分別獲取文本，您需要遍歷所有範圍並獲取其文本：

$('div span').each(function(){ 
    alert($(this).text()); 
}); 

Answer 3

你也可以利用這一點，

HTML：

<div> 
    <p>this is vignesh 
    <span>chinnaiyan</span> 
    </p> 
    <span>I</span> 
    <h1>LOVE</h1> 
    <span>PHP</span> 
</div> 
<div id="result"> 

</div> 

的Jquery：

var spantext = ""; 
$('div span').each(function() 
{ 
    spantext = spantext +" "+$(this).text(); 
    $("#result").html(spantext); 
}); 

輸出：

這是維涅什chinnaiyan chinnaiyan I LOVE PHP

小提琴鏈接https://jsfiddle.net/xo88rnk1/