JavaScript HTML DOM - 改变 CSS

最新推荐文章于 2024-03-11 23:29:23 发布

徐小七七

最新推荐文章于 2024-03-11 23:29:23 发布

阅读量393

点赞数

分类专栏： js 文章标签： javascript dom css html

本文链接：https://blog.csdn.net/xustart7720/article/details/78770096

版权

js 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

改变 HTML 样式

如需改变 HTML 元素的样式，请使用这个语法：

    document.getElementById(id).style.property = new style

例子 1

下面的例子会改变<p> 元素的样式：

<p id="p2">Hello World!</p>

<script>
    document.getElementById("p2").style.color = "blue";
</script>

例子 2

本例改变了id="id1" 的 HTML 元素的样式，当用户点击按钮时：

<h1 id="id1">My Heading 1</h1>

<button type="button" onclick="document.getElementById('id1').style.color='red'">
点击这里
</button>

例子3

如何使元素不可见。您希望元素显示或消失吗？

<!DOCTYPE html>
<html>
<body>

<p id="p1">这是一段文本。</p>

<input type="button" value="隐藏文本" onclick="document.getElementById('p1').style.visibility='hidden'" />
<input type="button" value="显示文本" onclick="document.getElementById('p1').style.visibility='visible'" />

</body>
</html>

徐小七七

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript HTML DOM - 改变 CSS

改变 HTML 样式如需改变 HTML 元素的样式，请使用这个语法： document.getElementById(id).style.property = new style例子 1下面的例子会改变<p> 元素的样式：<p id="p2">Hello World!</p><script> document.getElementById("p2").style.color = "bl
复制链接

扫一扫

专栏目录