我們一般來說，我們都知道要透過Jquery取得元素的內容(子元素)的時候。都會使用 html() 或是 innerHTML。
ex:
innerHTML
|
<!DOCTYPE html>
<html>
<body>
<p id="demo" onclick="myFunction()">Click me to change my HTML content (innerHTML).</p>
<script>
function myFunction() {
alert(document.getElementById("demo").innerHTML)
}
</script>
</body>
</html>
|
他會顯示跳出警告式窗，上面有 Click me to change my HTML content (innerHTML).
html()
|
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
alert($("p").html());
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">顯示元素內容</button>
</body>
</html>
</html>
|
他會顯示跳出警告式窗，上面有 This is a paragraph
但是，主體物件並不會選取顯示出來。後來查一查，還真有方法可以做到jQuery.prop("outerHTML")
|
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
alert($("p").prop("outerHTML"));
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button class="btn1">顯示元素內容</button>
</body>
</html>
</html>
|
他會顯示跳出警告式窗，上面有 <p>This is a paragraph.</p>
原生JS DOM里有一個内置屬性 outerHTML （看清大小寫哦，JS是區分大小寫的）用來獲取當前節點的html代碼(包含當前節點)，所以用jQuery的prop()能拿到
如果你用attr('outerHTML')，
留言列表
