回答(17)
2 years ago
修改JavaScript属性 document.body.style.background .
例如:
function changeBackground(color) {
document.body.style.background = color;
}
注意:这确实取决于您的页面如何组合在一起,例如,如果您使用具有不同背景颜色的DIV容器,则需要修改其背景颜色而不是文档正文 .
2 years ago
你不需要AJAX,只需要设置body元素的background-color属性的普通java脚本,如下所示:
document.body.style.backgroundColor = "#AA0000";
如果您想要像服务器一样启动它,则必须轮询服务器,然后相应地更改颜色 .
2 years ago
我同意之前的海报,即通过 className 改变颜色是一种更漂亮的方法 . 然而,我的论点是 className 可以被视为"why you want the background to be this or that color."的定义
例如,将其设置为红色不仅仅是因为您希望它变红,而是因为您想要通知用户错误 . 因此,在body上设置className AnErrorHasOccured 将是我首选的实现 .
在css
body.AnErrorHasOccured
{
background: #f00;
}
在JavaScript中:
document.body.className = "AnErrorHasOccured";
这使您可以选择根据此 className 设置更多元素 . 因此,通过设置 className ,您可以为页面提供某种状态 .
2 years ago
AJAX以异步方式使用Javascript和XML从服务器获取数据 . 除非您想从服务器下载颜色代码,否则这不是您的真正目标!
但是否则你可以用Javascript设置CSS背景 . 如果您使用的是像jQuery这样的框架,它将是这样的:
$('body').css('background', '#ccc');
否则,这应该工作:
document.body.style.background = "#ccc";
2 years ago
你可以通过以下方式实现 STEP 1
var imageUrl= "URL OF THE IMAGE HERE";
var BackgroundColor="RED"; // what ever color you want
用于更改 BODY 的背景
document.body.style.backgroundImage=imageUrl //changing bg image
document.body.style.backgroundColor=BackgroundColor //changing bg color
To change an element with ID
document.getElementById("ElementId").style.backgroundImage=imageUrl
document.getElementById("ElementId").style.backgroundColor=BackgroundColor
for elements with same class
var elements = document.getElementsByClassName("ClassName")
for (var i = 0; i < elements.length; i++) {
elements[i].style.background=imageUrl;
}
2 years ago
我不会把它归类为“AJAX” . 无论如何,像下面这样的东西应该做的伎俩:
document.body.style.backgroundColor = 'pink';
2 years ago
Css方法:
如果要查看连续颜色,请使用以下代码:
body{
background-color:black;
animation: image 10s infinite alternate;
animation:image 10s infinite alternate;
animation:image 10s infinite alternate;
}
@keyframes image{
0%{
background-color:blue;
}
25%/{
background-color:red;
}
50%{
background-color:green;
}
75%{
background-color:pink;
}
100%{
background-color:yellow;
}
}
如果您希望更快或更慢地看到它,请将10秒更改为5秒等 .
2 years ago
您只需使用以下命令即可更改页面背景:
document.body.style.background = #000000; //I used black as color code
但是,下面的脚本将使用setTimeout()函数每3秒更改一次页面的背景:
$(function() {
var colors = ["#0099cc","#c0c0c0","#587b2e","#990000","#000000","#1C8200","#987baa","#981890","#AA8971","#1987FC","#99081E"];
setInterval(function() {
var bodybgarrayno = Math.floor(Math.random() * colors.length);
var selectedcolor = colors[bodybgarrayno];
$("body").css("background",selectedcolor);
}, 3000);
})
2 years ago
我更愿意看到在这里使用css类 . 它避免了在javascript中难以阅读颜色/十六进制代码 .
document.body.className = className;
2 years ago
这将根据从下拉菜单中选择的用户选择更改背景颜色:
function changeBG() {
var selectedBGColor = document.getElementById("bgchoice").value;
document.body.style.backgroundColor = selectedBGColor;
}
Red
Ivory
Pink
2 years ago
将此脚本元素添加到body元素,根据需要更改颜色:
Hello, World!
document.body.style.backgroundColor = "#ff0000"; // red
2 years ago
但您可能希望在
元素存在之前配置正文颜色 . 这样它就有了正确的颜色 .var myColor = "#AAAAAA";
document.write('\
body{\
background-color: '+myColor+';\
}\
\
');
这可以放入文档的
或js文件中 .这是一个很好的颜色 .
var myColor = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
2 years ago
我建议使用以下代码:
background color
function colorize() {
var element = document.getElementById("example");
element.style.backgroundColor='#800';
element.style.color='white';
element.style.textAlign='center';
}
2 years ago
如果你想使用按钮或其他事件,只需在JS中使用它:
document.querySelector("button").addEventListener("click", function() {
document.body.style.backgroundColor = "red";
});
2 years ago
您只需使用以下命令即可更改页面背景:
function changeBodyBg(color){
document.body.style.background = color;
}
2 years ago
或者,如果您希望以rgb表示法指定背景颜色值,请尝试
document.getElementById("yourid").style.backgroundColor = 'rgb(' + a + ',' + b + ',' + c + ')';
其中a,b,c是颜色值
例:
document.getElementById("yourid").style.backgroundColor = 'rgb(224,224,224)';
2 years ago
这是使用javascript更改背景的简单编码