您好,登錄后才能下訂單哦!
這篇文章將為大家詳細(xì)講解有關(guān)如何在jquery中使用html()方法,文章內(nèi)容質(zhì)量較高,因此小編分享給大家做個參考,希望大家閱讀完這篇文章后對相關(guān)知識有一定的了解。
在javascript中,“html()”方法的用法是“元素.html(被選元素的新內(nèi)容)”。html方法設(shè)置或返回被選元素的內(nèi)容,當(dāng)該方法用于返回內(nèi)容時,則返回第一個匹配元素的內(nèi)容;當(dāng)該方法用于設(shè)置內(nèi)容時,則重寫所有匹配元素的內(nèi)容。
HTML內(nèi)容就是內(nèi)容中可以包含HTML標(biāo)簽,并且能夠被瀏覽器渲染。
文本內(nèi)容是先將內(nèi)容中的HTML預(yù)定義字符轉(zhuǎn)換成html字符實(shí)體,這樣HTML標(biāo)簽就不會被渲染。
語法結(jié)構(gòu)一:
$(selector).html()
此時方法不帶參數(shù)時候是取得第一個匹配元素的html內(nèi)容。
此方法與text()方法沒有參數(shù)用法類似,但是還是有很大區(qū)別:
一.html()方法取得第一個匹配元素的內(nèi)容,而text()方法是取得所有匹配元素包含的內(nèi)容。
二.html()方法取得內(nèi)容html內(nèi)容,而text()方法取得是文本內(nèi)容。
實(shí)例代碼:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8" /> <meta name="author" content="https://www.jb51.net/" /> <title></title> <style type="text/css"> div{ height:150px; width:150px; background-color:green; margin-top:10px; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function () { $("button").click(function () { alert($("div").html()); }); }); </script> </head> <body> <div> <ul> <li> <span>歡迎您</span> </li> </ul> </div> <button>點(diǎn)擊查看效果</button> </body> </html>
以上代碼將返回div元素中的內(nèi)容。
語法結(jié)構(gòu)二:
$(selector).html(content)
帶有參數(shù)的時候是設(shè)置所有匹配元素而的html內(nèi)容。
此方法與text()方法帶有參數(shù)的用法類似,但是還是有很大的區(qū)別:
html()方法設(shè)置的是html內(nèi)容,而text()方法設(shè)置的是文本內(nèi)容。
實(shí)例代碼:
以下代碼將div中的html內(nèi)容設(shè)置為"<b>我是重新設(shè)置后的內(nèi)容</b>"。
<!DOCTYPE html> <html> <head> <meta charset=" utf-8" /> <meta name="author" content="https://www.jb51.net/" /> <title>腳本之家</title> <style type="text/css"> div { height:150px; width:150px; background-color:green; margin-top:10px; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function () { $("button").click(function () { $("div").html("<b>我是重新設(shè)置后的內(nèi)容</b>"); }); }); </script> </head> <body> <div>原來內(nèi)容</div> <button>點(diǎn)擊查看效果</button> </body> </html>
關(guān)于如何在jquery中使用html()方法就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,可以學(xué)到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。