改变字体颜色

Marron957

于 2021-06-20 20:11:15 发布

阅读量197

点赞数 1

分类专栏： HTML 文章标签： html css js web

本文链接：https://blog.csdn.net/Marron957/article/details/118074302

版权

HTML 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

这是一个HTML页面示例，展示了如何使用JavaScript实现点击按钮切换文本颜色的功能。页面包含一个主div，内有工作守则的文字，以及一个按钮。点击按钮，文本颜色会在红色和aliceblue之间切换。

摘要由CSDN通过智能技术生成

<!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>按键更改字体颜色</title>
</head>

</body>
<script>
var btn = document.querySelector("input");
var zi = document.querySelectorAll("span");
btn.onclick = function () {
if (zi[0].style.color == "") {
for (var index = 0; index < zi.length; index++) {
zi[index].style.color = "red";
}
}
else{
for (var index = 0; index < zi.length; index++) {
zi[index].style.color = "aliceblue";
}
}