JS中innerHTML，innerText，value

最新推荐文章于 2022-11-30 22:33:14 发布

转载最新推荐文章于 2022-11-30 22:33:14 发布 · 256 阅读

文章标签：

#JS中innerHTML，innerText，value

前端杂记专栏收录该内容

29 篇文章

订阅专栏

本文通过三个示例介绍了JavaScript中innerHTML, innerText 和 value 属性的区别及使用场景。innerHTML用于设置或获取元素的HTML内容；innerText用于设置或获取元素的纯文本内容；value用于设置或获取表单元素的值。

JS中innerHTML，innerText，value

JS中getElementById后我们取什么？ - Holyson - 凡图的编程之路

innerHTML

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph.</p>
<script>
document.getElementById("demo").innerHTML="<h1>My First JavaScript</h1>";
</script>
</body>
</html>

输出结果:

My First Web Page

My First Javascript

innerText

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph.</p>
<script>
document.getElementById("demo").innerText="<h1>My First JavaScript</h1>";
</script>
</body>
</html>

输出结果：

My First Web Page

<h1>My First Javascript</h1>

value

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph.</p>
<script>
document.getElementById("demo").value="<h1>My First JavaScript</h1>";
</script>
</body>
</html>

输出结果：