如何獲得多個div的HTML內容

Question

請我想用相同的ID很多div的HTML內容，這是我的代碼：

<div id="my_div">This is content I</div> 
<div id="my_div">This is content J</div> 
<div id="my_div">This is content P</div> 
<div id="my_div">This is content Z</div> 

這是我的jQuery代碼：

document.getElementById('my_div').innerHTML; 

但它只給了我一個div的內容。例如This is content I。這是我真正想要的This is content IThis is content JThis is content PThis is content Z。請如何運行我的代碼？

Answer 1

添加同一類所有的div：試試這個：

<div class="my_div">This is content I</div> 
<div class="my_div">This is content J</div> 
<div class="my_div">This is content P</div> 
<div class="my_div">This is content Z</div> 

var str =""; 
$(".my_div").each(function() { 
    str = str + $(this).html() + " "; 
}) 
alert(str) 

Answer 2

開始：

<div class="my_div">This is content I</div> 
<div class="my_div">This is content J</div> 
<div class="my_div">This is content P</div> 
<div class="my_div">This is content Z</div> 

然後使用jQuery的。每次上.my_div的選擇。請參閱Dhara Parmar的回答

$(".my_div").each(function(index) { 
    console.log(index + ": " + $(this).html()); 
}); 

將向您顯示結果，然後最終在循環中進行連接。

Answer 3

更改您的HTML中使用class，而不是id：

<div class="my_div">This is content I</div> 
<div class="my_div">This is content J</div> 
<div class="my_div">This is content P</div> 
<div class="my_div">This is content Z</div> 

，並通過其值的循環，讓他們每個人：

function showDivValues(){ 
    var length = document.getElementsByClassName('my_div').length; 

    for(var i = 0; i < length; i++){ 
     console.log(document.getElementsByClassName('my_div')[i].innerHTML); 
    } 
}