⽤JavaScript简单的改变⽹页背景⾊
⼀、题⽬要求
在⼀个⽂本框⾥⾯输⼊颜⾊的名称（如：蓝⾊，紫⾊），点击⽂本框旁边的按钮，让⽹页的背景⾊改变成⽂本框中的名称对应的颜⾊。⼆、代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>⽹页变⾊</title>
<script type="text/javascript">
function show(){
var ElementsByTagName("body");
var ElementById("i1");
var ElementById("i2").value;  <!--获取⽂本框中的值-->
var c2;
switch(c1){
case '蓝⾊': c2="blue"; break;
case '黄⾊': c2="yellow";break;
case '浅蓝⾊':c2="lightblue";break;
case '紫⾊':c2="purple";break;
case '粉⾊':c2="pink";break;
}
y.style.backgroundColor=c2;
}
</script>
</head>
<body id="i1"  >  <!-- ⽹页的原始背景⾊-->
<div align="center">
<input type="text" id="i2">
<input type="button" value="改变颜⾊" onclick="show()">
</div>
</body>
</html>
三、结果图展⽰
修改之前：
修改之后：
四、总结
1、在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。
网页设计html代码大全怎么改颜
2、在编程语⾔中，变量⽤于存储数据值。JavaScript 使⽤ var 关键词来声明变量。= 号⽤于为变量赋值。
3、查HTML元素
⽅法描述
五、⽤点击按钮的⽅式改变⽹页背景⾊（简单）
1、代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>改变⽹页背景⾊</title>
<script>
function color(str){
document.body.style.backgroundColor=str;
}
</script>
</head>
<input type="button" value="粉红⾊" onclick="color('pink')"/>
<input type="button" value="紫⾊" onclick="color('purple')"/>
<input type="button" value="蓝⾊" onclick="color('blue')"/>
<input type="button" value="⾃定义颜⾊" onclick="color('lightblue')"/> <body>
</body>
</html>
2、结果图展⽰

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。