溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹js中value&innerHTML&innerText&textContent之間的區別有哪些，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！
1、value：應用于表單的輸入框（textarea除外）
2、innerHTML:可以寫入HTML代碼，寫入的HTML代碼可以被解析，獲得時候也可以獲得HTML代碼
3、innerText：獲得內容的時候，會忽略HTML代碼，寫入HTML代碼不能解析。獲得內容與HTML解析的內容一樣
4、textContent：獲得內容的時候，會忽略HTML代碼，寫入HTML代碼不能解析。獲取的內容與源碼內容一樣
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>修改元素的文本</title>
<style type="text/css">
div{
width:300px;
height:300px;
float:left;
border:1px solid blue;
margin-left:50px;
}
</style>
</head>
<body>
<div><p>i love you</p></div>
<div></div>
<div></div>
<div></div>
<div>
<p>J
哥 最 帥</p>
<a href="http://www.xxoo.com">xx oo</a>
</div>
<div></div>
<script type="text/javascript">
var divs=document.getElementsByTagName('div'); /*
value :應用于表單的輸入框---textarea
innerHTML：與后兩者的區別，可以寫入html代碼會被解析，并且可以獲得html代碼
innerText:獲得內容的時候，都會忽略html代碼
textContent:獲得內容的時候，都會忽略html代碼
*/
//讀取內容
console.log(divs[0].innerHTML);
console.log(divs[0].innerText);
console.log(divs[0].textContent); //寫入內容
divs[1].innerHTML='<p>i miss you</p>';
divs[2].innerText='<p>i miss you</p>';
divs[3].textContent='<p>i miss you</p>'; /*
比較innerText和textContent的區別
innerText 獲取的內容和html解析的內容一樣
textContent獲取的內容與源代碼的內容一樣
*/
console.log('%c'+divs[4].innerText,'color:red;');
console.log(divs[4].textContent); var str="<p>哥 最 帥</p>
<a href='http://www.xxoo.com'>xx oo</a>"; // divs[5].innerText=str;
// divs[5].textContent=str;
</script>
</body>
</html>以上是js中value&innerHTML&innerText&textContent之間的區別有哪些的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
