如何使用HTML逐个获取hrml标签？

Question

我希望根据文档使用javascripts innerHTML()方法获取选定元素的整个html，而不仅仅是它的contents. .html()。 HTML：

<div id="div1"> 
    <p>Some Content</p> 
    <p>Some Content</p> 
    </div> 

使用$("#div1").html()。其返回的孔洞内容为div标签

<p>Some Content</p> 
<p>Some Content</p> 

我无法使用。我需要一个一个的标签，如何使用每个语句得到这个。任何人请帮助。

Answer 1

获取所有的孩子并重复它们。 Html内容可以从outerHTML获得dom元素的属性。

// for older browser compatibility use [].slice.call instead of Array.from 
 
Array.from(document.querySelectorAll('#div1 p')).forEach(function(ele) { 
 
    console.log(ele.outerHTML); 
 
})

<div id="div1"> 
 
    <p>Some Content</p> 
 
    <p>Some Content</p> 
 
</div>

---

对于使用each()方法jQuery的。

$('#div1 p').each(function() { 
 
    console.log(this.outerHTML); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div1"> 
 
    <p>Some Content</p> 
 
    <p>Some Content</p> 
 
</div>

Answer 2

你不需要.html()，你需要.children()。

$('#div1').children().each(function (index, childEl) { 
    console.log(childEl); 
}); 

https://api.jquery.com/children/