如何使用 Javascript 更改背景颜色？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21919478/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to change the background color using Javascript?
提问by user3334606
I wanna change the background color of the page using the user input. here's my code so far..
我想使用用户输入更改页面的背景颜色。到目前为止，这是我的代码..
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<script type = "text/javascript">
function paintIt(){
color = prompt("Enter the color you want on the Background???");
switch (color){
}
}
</script>
<form>
<input type = "button" value = "Paint Me" onclick ="paintIt()">
</form>
</body>
</html>
and my just simple css
和我简单的 css
html {font-family:Arial, Helvetica, sans-serif; colour:#fff;}
body{background-color:#ccc; margin:0;}
Thanks
谢谢
回答by Hanlet Esca?o
function paintIt()
{
color = prompt("Enter the color you want on the Background???");
document.body.style.backgroundColor = color;
}
try something like #000000or #fff.
尝试类似#000000或#fff。
回答by Hanlet Esca?o
Try this:
试试这个：
function paintIt(){
document.body.style.backgroundColor = "red";
}
回答by Sachin
Try with this
试试这个
function paintIt(){
color = prompt("Enter the color you want on the Background???");
document.body.style.backgroundColor = color;
}
You can try this RGB Color Parserfor validating the color names in different format whether they are valid color or not. Here is a demo.
回答by Jeremy Hert
A simple example that expects the user to enter a valid background color:
一个希望用户输入有效背景颜色的简单示例：
<button id="my-button">Change background</button>
<script>
document.getElementById("my-button").addEventListener("click", function() {
document.body.style.backgroundColor = prompt("What color");
});
</script>
JSFiddle: http://jsfiddle.net/XLL3n/1/
JSFiddle：http: //jsfiddle.net/XLL3n/1/
And I have no rep. so I can't comment, but you should really consider reading about css colorsto understand possible valid inputs. The library pointed out by @Sachin looks nice.
我没有代表。所以我无法发表评论，但您真的应该考虑阅读有关 css 颜色的信息以了解可能的有效输入。@Sachin 指出的图书馆看起来不错。
回答by Arun Reddy
<script type = "text/javascript">
function paintIt(){
color = prompt("Enter the color you want on the Background???");
switch (color){
case "red":
document.body.style.background = color;
break;
case "white":
document.body.style.background = color;
break;
default: alert("not a valid color");
}
}
</script>
