獲取span標籤的所有innerhtml內容

我試圖獲取div＃parent的所有子標籤的內容，並且我無法做到，我只是得到第一個。請有人幫助我！獲取span標籤的所有innerhtml內容

$(document).ready(function() { 
 
    var allspans=$("#parent").find("span").html(); 
 
    console.log(allspans); 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>jQuery</title> 
 
</head> 
 
<body> 
 
    <div id="parent"> 
 
    <span>Element_1</span> 
 
    <span>Element_2</span> 
 
    <span>Element_3</span> 
 
    <span>Element_4</span> 
 
    <span>Element_5</span> 
 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    </div> 
 
</body> 
 
</html>

謝謝！最好的問候！

來源

2017-08-10 Alberto

嘗試用map()和get()功能。你將得到所有的span標記的innerHTML與陣列

$(document).ready(function() { 
 
    var allspans=$("#parent").find("span").map(function(){ 
 
    return $(this).html(); 
 
    }).get() 
 
    console.log(allspans); 
 
});

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>jQuery</title> 
 
</head> 
 
<body> 
 
    <div id="parent"> 
 
    <span>Element_1</span> 
 
    <span>Element_2</span> 
 
    <span>Element_3</span> 
 
    <span>Element_4</span> 
 
    <span>Element_5</span> 
 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    </div> 
 
</body> 
 
</html>

來源

2017-08-10 06:17:45 prasanth

您需要使用一些循環，直到$（「＃父」） .find（「span」）。length，默認情況下jquery html函數會返回第一個匹配元素的內容：

var html = ''; 
var allspans = $("#parent").find("span"); 
for(var i=0;i<allspans.length;i++){ 
    html += allspans[i].innerHTML; 
}

來源

2017-08-10 06:17:57

您可以使用.each來遍歷span，然後像這樣訪問它們各自的innerHTML。通過.each，您可以將內部HTML內容組合到數組或字符串中。

或者，您可以通過$("#parent").text()獲得所有span的內部文本。

$(document).ready(function() { 
 
    $("#parent").find("span").each(function() { 
 
    console.log($(this).html()); 
 
    }); 
 
    
 
    console.log($("#parent").text()); 
 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>jQuery</title> 
 
</head> 
 

 
<body> 
 
    <div id="parent"> 
 
    <span>Element_1</span> 
 
    <span>Element_2</span> 
 
    <span>Element_3</span> 
 
    <span>Element_4</span> 
 
    <span>Element_5</span> 
 
    <script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
    </div> 
 
</body> 
 

 
</html>

來源

2017-08-10 06:18:31 Nisarg

$(document).ready(function() { 
 
    var allspans=$("#parent").find("span"); 
 
    var allSpanHtml = ''; 
 
    allspans.each(function() { 
 
    allSpanHtml += $(this).html(); 
 
    }); 
 
    console.log(allSpanHtml); 
 
});

<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
<div id="parent"> 
 
    <span>Element_1</span> 
 
    <span>Element_2</span> 
 
    <span>Element_3</span> 
 
    <span>Element_4</span> 
 
    <span>Element_5</span> 
 
</div>

您可以使用3210通過元素的數組迭代，然後用.html()擺脫個別元素的文本。

來源

2017-08-10 06:21:05 Durga

嘗試此

var arraySpan = []; 
$('span').each(function() { 
    arraySpan.push(this.innerHTML); 
});

來源

2017-08-10 06:21:36

你會需要遍歷由選擇器和控制檯匹配每個跨度登錄每個HTML值或將它們連接成一個變量或它們推到一個數組變量;取決於最好的作品。

做這樣的事情：

$(document).ready(function() { 
    $("#parent").find("span").each(function(){ 
    console.log($(this).html()); 
    }); 
});

記錄每個跨度的HTML值。

來源

2017-08-10 06:26:54 korwalskiy

獲取span標籤的所有innerhtml內容

回答

相關問題