如何在JS中改变DOM元素的文本内容
时间：2021-04-22 来源：互联网
今天PHP爱好者为您带来在JavaScript中获取元素只是第一步，如何对元素的属性进行更改才是接下里的重要步骤，本文主要讲述了如何在JS中更改DOM元素的内容。希望对大家有所帮助。
HTML表单内容：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">
<p></p>
</div>
</body>
</html>
1.textContent：
<script>
const box=document.querySelector(".box");
console.log(box);
const p=document.querySelector('p');
console.log(p);
//textContent:添加文本
p.textContent ="hello world";
</script>
2.innerText：
<script>
const box=document.querySelector(".box");
console.log(box);
const p=document.querySelector('p');
console.log(p);
p.innerText ="php.cn";
</script>
3.innerHTML：
<script>
const box=document.querySelector(".box");
console.log(box);
const p=document.querySelector('p');
console.log(p);
//将html字符串渲染出来应该使用innerHTML
p.innerHTML='<em style="color:red">php.cn</em>';
</script>
以上就是如何在JS中改变DOM元素的文本内容的详细内容，更多请关注php爱好者其它相关文章！
相关阅读更多 +
-
2024突然爆火的梗是什么梗？全网刷屏的真相揭秘，看完秒懂！ 2025-09-07 -
突然很挺的梗是什么梗 揭秘网络爆火流行语背后真相 2025-09-07
-
突然就不香了是什么梗？揭秘网络热词背后的真相，看完秒懂！ 2025-09-07
-
突然嚼口香糖是什么梗？揭秘年轻人社交新暗号，轻松get潮流密码！ 2025-09-07
-
突然失去梦想是什么梗？揭秘年轻人集体摆烂背后的真实原因 2025-09-07
-
突然想到的梗是什么梗？揭秘网络热梗背后的爆笑真相，看完秒懂！ 2025-09-07
最近更新
