jquery 獲取 outerHtml 包含當(dāng)前節(jié)點(diǎn)本身的代碼

更新時(shí)間：2014年10月30日 16:38:56 投稿：whsnow

jQuery.html() 是獲取當(dāng)前節(jié)點(diǎn)下的html代碼，并不包含當(dāng)前節(jié)點(diǎn)本身的代碼，后來(lái)實(shí)驗(yàn)發(fā)現(xiàn)有一個(gè)jQuery的一個(gè)方法可以解決

在開發(fā)過程中，jQuery.html() 是獲取當(dāng)前節(jié)點(diǎn)下的html代碼，并不包含當(dāng)前節(jié)點(diǎn)本身的代碼，然后我們有時(shí)候確需要，找遍jQuery api文檔也沒有任何方法可以拿到。

看到有的人通過parent().html()，如果當(dāng)前元素沒有兄弟元素還行，如果有那就行不通了。后來(lái)實(shí)驗(yàn)發(fā)現(xiàn)有一個(gè)jQuery的一個(gè)方法可以解決，而且非常簡(jiǎn)便，如下：

jQuery.prop("outerHTML");

復(fù)制代碼代碼如下:

<div class="test"><p>hello，你好！</p></div>

<script>

$(".test").prop("outerHTML");

</script>

輸出結(jié)果為：<div class="test"><P>hello,你好！</p></div>

因?yàn)樵鶭S DOM里有一個(gè)內(nèi)置屬性 outerHTML （看清大小寫哦，JS是區(qū)分大小寫的）用來(lái)獲取當(dāng)前節(jié)點(diǎn)的html代碼(包含當(dāng)前節(jié)點(diǎn))，所以用jQuery的prop()能拿到，經(jīng)過實(shí)驗(yàn)attr()方法是拿不到的，不信的話，大家也可以嘗試嘗試，謝謝。

當(dāng)然也有人用jQuery的 clone() 函數(shù)配合append() 來(lái)創(chuàng)建一個(gè)只有一個(gè)子元素的節(jié)點(diǎn)，然后來(lái)拿節(jié)點(diǎn)的html，這樣也是可行的，但是代碼繁瑣。

您可能感興趣的文章:

相關(guān)文章

jQuery stop()用法實(shí)例詳解
一直對(duì)stop的用法一知半解，今天抽點(diǎn)時(shí)間學(xué)習(xí)下jQuery stop()用法實(shí)例詳解的相關(guān)知識(shí)，特此分享腳本之家平臺(tái)，供大家參考
2016-07-07
使用element-ui的el-menu導(dǎo)航選中后刷新頁(yè)面保持當(dāng)前選中狀態(tài)
這篇文章主要介紹了使用element-ui的el-menu導(dǎo)航選中后刷新頁(yè)面保持當(dāng)前選中狀態(tài)，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-07-07
jquery+ajax請(qǐng)求且?guī)Х祷刂档拇a
這兩天的工作內(nèi)容不多，基本是關(guān)于jquery中ajax的。之前一直都是寫的最簡(jiǎn)單的ajax請(qǐng)求，并沒關(guān)注怎么獲取ajax返回值的問題。
2015-08-08
jQuery中innerWidth()方法用法實(shí)例
這篇文章主要介紹了jQuery中innerWidth()方法用法,實(shí)例分析了innerWidth()方法的功能、定義及獲取第一個(gè)匹配元素內(nèi)部區(qū)域?qū)挾鹊氖褂眉记?需要的朋友可以參考下
2015-01-01
jquery ajax局部加載方法詳解(實(shí)現(xiàn)代碼)
下面想就為大家?guī)?lái)一篇jquery ajax局部加載方法詳解(實(shí)現(xiàn)代碼)。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考，一起跟隨小編過來(lái)看看吧
2016-05-05
jQuery Validate 校驗(yàn)多個(gè)相同name的方法
這篇文章主要介紹了jQuery Validate 校驗(yàn)多個(gè)相同name的方法,需要的朋友可以參考下
2017-05-05
Jquery 表單驗(yàn)證類介紹與實(shí)例
Jquery 表單驗(yàn)證類介紹與實(shí)例，需要的朋友可以參考一下
2013-06-06
jQuery對(duì)象與DOM對(duì)象轉(zhuǎn)換方法詳解
這篇文章主要介紹了jQuery對(duì)象與DOM對(duì)象的轉(zhuǎn)換方法,結(jié)合實(shí)例形式分析了jQuery對(duì)象及DOM對(duì)象的作用與二者的相互轉(zhuǎn)換技巧,需要的朋友可以參考下
2016-05-05
用jquery來(lái)定位
這篇文章主要介紹了用jquery來(lái)定位
2007-02-02
jQuery AJAX 調(diào)用WebService實(shí)現(xiàn)代碼
用jQuery調(diào)用其他項(xiàng)目的WebService的代碼，需要的朋友可以參考下。
2010-03-03