Javascript实现页面背景颜色的改变

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button style="background:red">red</button>
<button style="background:green">green</button>
<button style="background:blue">blue</button>
<button style="background:aqua">aqua</button>
<button style="background:pink">pink</button>

<script type="text/javascript">
var node=document.getElementsByTagName(‘button‘);
for(var i=0;i<node.length;i++){
    node[i].onclick=function(){
    document.documentElement.style.background=this.style.background;
    }
}
</script>
</body>
</html>

//背景图片的改变

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<button style="background:url(‘1.jpg‘)">背景1</button>
<button style="background:url(‘2.jpg‘)">背景2</button>
<button style="background:url(‘3.jpg‘)">背景3</button>
<script type="text/javascript">
var node=document.getElementsByTagName(‘button‘);
for(var i=0;i<node.length;i++){
node[i].onclick=function(){
document.documentElement.style.background=this.style.background;
}
}
</script>
</body>
</html>

//附用到的背景图3张

时间: 08-29

Javascript实现页面背景颜色的改变的相关文章

背景颜色的改变

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

Android Them+SharedPreferences 修改程序所有view字体颜色、大小和页面背景

有这么一个需求,可以对页面的样式进行选择,然后根据选择改变程序所有字体颜色和页面背景.同时下一次启动程序,当前设置依然有效. 根据需求,我们需要一种快速,方便,有效的方式来实现需求,然后可以通过Android Them + SharedPreferences 来实现需求.Them用于存放设置的每一种样式,并应用于程序中,SharedPreferences用于记住程序当前的样式,根据SharedPreferences的内容来设置程序的样式,实现下次启动能够oncreat当前的样式设置. 这里的Th

CSS3改变页面默认选中背景颜色及设置页面禁止全选或局部选择

改变默认选中的背景颜色 ::-moz-selection{background:#FF0000;color:#FFFFFF;} ::selection {background:#FF0000;color:#FFFFFF;} code::-moz-selection {background:#FF0000;color:#FFFFFF;} code::selection {background:#FF0000;color:#FFFFFF;} 设置页面禁止选中 /*全局*/ html,body{ pa

jquery改变背景颜色

jquery改变背景颜色<html><head><script type="text/javascript" src="/jquery/jquery.js"></script><script type="text/javascript">$(document).ready(function(){  $("button").toggle(function(){    $

VBA在Excel中的应用(一):改变符合条件单元格的背景颜色

在使用excel处理数据的时候,为了能更清晰的标示出满足特定条件的单元格,对单元格添加背景色是不错的选择.手工处理的方式简单快捷,但是当遇到大批量数据,就会特别的费时费力,而且不讨好(容易出错).通过代码来处理是个不错的选择,excel可以通过VBA编程来处理内部数据,在打开excel页面后,可以通过“alt + F11”组合键来启动VBA编程界面,跟VB的编程界面和语法一样,需要注意的是如何调用excel的内容.VBA通过sheet, range和cells三个层次来调用excel中的制定区域

改变cell的背景颜色

#define DARK_BACKGROUND  [UIColor colorWithRed:151.0/255.0 green:152.0/255.0 blue:155.0/255.0 alpha:1.0]; - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{    cell.backgroun

iOS中通过设置CSS改变WebView字体大小,颜色,背景颜色

因为WebView自带的属性是不可以改变字体大小颜色这些需求的,只能通过改变css样式,内置来解决.在百度上搜了半天很多不靠谱,现在给出几种解决方案如下: 1.第一种方式:在WebView的代理方法webViewDidFinishLoad中: 字体大小: [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '12

Android RadioGroup的RadioButton 选择改变字体颜色和背景颜色

RadioGroup <RadioGroup android:id="@+id/client_charge_radiogroup" android:layout_width="200dp" android:layout_height="40dp" android:layout_marginLeft="5dp" android:layout_alignParentRight="true" android

MFC 如何改变对话框的默认背景颜色(转)

下面介绍三种方法:实现改变对话框的默认背景颜色: (1)可以在CLotteryApp::InitInstance()设置更新对话框的背景颜色 调用SetDialogBkColor(RGB(160,32,240)) 即可以改变背景颜色 注意这里绘制的颜色是针对程序中所有的对话框 SetDialogBkColor(RGB(0,0,255),RGB(255,0,0)); 前一个RGB是背景色,后一RGB是文本颜色 (2)也可以再CLotteryDlg::OnPaint() 函数里的 else 之后括号