天遇到個(gè)來(lái)咨詢利用原生的JS代碼來(lái)修改HTML代碼的的童鞋,耐心的給這個(gè)童鞋做了解答后,然后整理了一下測(cè)試代碼,寫(xiě)成文章記錄一下,方便以后有同需求的站長(zhǎng)們。
HTML原始代碼
<form action="" method="post" class="form"> <input id="mm" type="text" > <input id="mochu" type="text" onclick="act(this.value)" /> <input id="mc" type="text" > </form>
利用JS代碼將以上HTML代中的 id 為 mochu 的 input 中的 cnclick 屬性去掉
<input id="mochu" type="text" onclick="act(this.value)" />
換成
<input id="mochu" type="text" />
利用 JS中dom對(duì)象的 outerHTML 屬性,可以輕松的解決這個(gè)問(wèn)題
outerHTML:設(shè)置或獲取對(duì)象及其內(nèi)容的 HTML 形式
例:JS獲取元表本身的HTML代碼
代碼:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form action="" method="post" class="form">
<input id="mm" type="text" value="飛鳥(niǎo)慕魚(yú)博客" >
<input id="mochu" type="text" onclick="act(this.value)" value="http://www.feiniaomy.com" />
<input id="mc" type="text" >
</form>
<script>
var html = document.getElementById('mochu').outerHTML;
console.log(html);
</script>
</body>
</html>
打印結(jié)果:
例:js修改指定元素的本身的HTML代碼
通上面的例子,可以知道 outerHTML 屬性可以獲取到元素本身的HTML代碼,既然可以獲取也能設(shè)置或修改元素本身的代碼
代碼:
<!DOCTYPE html> <html> <head> </head> <body> <form action="" method="post" class="form"> <input id="mm" type="text" value="飛鳥(niǎo)慕魚(yú)博客" > <input id="mochu" type="text" onclick="act(this.value)"/> <input id="mc" type="text" > </form> <script> var html = document.getElementById('mochu').outerHTML = '<input id="mochu" type="text" value="http://www.feiniaomy.com" />'; </script> </body> </html>
運(yùn)行結(jié)果如圖所示
以下是與 outerHTML 功能相似的屬性,下一篇文章會(huì)詳細(xì)說(shuō)明一下他們的作用與區(qū)別
innerHTML:設(shè)置或獲取對(duì)象起始標(biāo)簽和結(jié)束標(biāo)簽之間的內(nèi)容。
innerText:設(shè)置或獲取位于對(duì)象起始和結(jié)束標(biāo)簽內(nèi)的文本
outerHTML:設(shè)置或獲取對(duì)象及其內(nèi)容的 HTML 形式
outerText:設(shè)置或獲取對(duì)象的文本
avaweb技術(shù)分享
做為一名合格的Java web開(kāi)發(fā)程序員,我們經(jīng)常要精通前端和后端的各種代碼,后端的Java也是我們經(jīng)常用到的主要語(yǔ)言之一,前端那我們肯定用的是Javascript。
因此關(guān)于Java和Javascript的異同也是經(jīng)常有人拿來(lái)做比較的,其實(shí)當(dāng)時(shí)Javascript起的這個(gè)名字就是為了傍Java這個(gè)當(dāng)時(shí)非常出名的語(yǔ)言,而如今Javascript也確實(shí)順了當(dāng)初開(kāi)發(fā)者想出名的心愿。
現(xiàn)在的Javascript也是火得不要不要的,也至于各種框架也就隨之而來(lái),比如jQuery等等。。。
在Java中我們?nèi)绻鎿Q所有指定的字符串首先想到的是String#replaceAll這個(gè)方法,那如果我們?cè)贘avascript中要怎么做到的呢?
那還不趕快關(guān)注熱愛(ài)科技數(shù)碼的我,讓我們一起學(xué)習(xí)與進(jìn)步。
Javaweb技術(shù)分享
則:
<script[^>]*?>.*?</script> 刪除所有js腳本
<(.[^>]*)> 刪除所有的 <>
<!--.* 刪除所有的注釋內(nèi)容
-->
全部代碼:
*請(qǐng)認(rèn)真填寫(xiě)需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。