您的位置 首页 java

JavaScript HTML DOM-改变CSS

HTML DOM 允许 JavaScript 改变 HTML 元素的样式。

改变 HTML 样式

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

document.getElementById(id).style.property=新样式

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

实例

<html>

<body>

<p id=”p2″>Hello World!</p>

<script>

document.getElementById(“p2″).style.color=”blue”;

</script>

<p>以上段落通过脚本修改。</p>

</body>

</html>

使用事件

HTML DOM 允许我们通过触发事件来执行代码。

比如以下事件:

  • 元素被点击。

  • 页面加载完成。

  • 输入框被修改。

  • ……

在接下来我介绍关于事件的知识。

本例改变了 id=”id1″ 的 HTML 元素的样式,当用户点击按钮时:

实例

<!DOCTYPE html>

<html>

<body>

<h1 id=”id1″>我的标题 1</h1>

<button type=”button”

onclick=”document.getElementById(‘id1’).style.color=’red'”>

点我!</button>

</body>

</html>

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!

文章来源:智云一二三科技

文章标题:JavaScript HTML DOM-改变CSS

文章地址:https://www.zhihuclub.com/188501.shtml

关于作者: 智云科技

热门文章

网站地图