这篇文章主要介绍了JS实现点击颜色块切换指定区域背景颜色的方法,涉及javascript操作cookie及背景色的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
本文实例讲述了JS实现点击颜色块切换指定区域背景颜色的方法。分享给大家供大家参考。具体实现方法如下：
复制代码 代码如下:
<html>
<head>
<title>JS实现点击颜色块切换指定区域的背景颜色</title>
</head>
<body>
<div>
<table bgcolor=#F8F8F8 cellpadding="0">
<tr>
<td colspan="2">
<div>
<table cellpadding="0">
<tr><td><span>适时切换网页指定区域背景颜色</span></td>
</tr></table>
</div>
</td>
</tr></table></div>
<div>
<table cellpadding="0">
<tr><td><p><font color="#808080"><span>请选择背景：</span></font></td>
<td><div><table cellspacing="0" cellpadding="0" bordercolor="#FFFFFF">
<tr>
<td bgcolor="#FDFDF0"></td>
<td bgcolor="#B1D5F3"></td>
<td bgcolor="#B4E7D9"></td>
<td bgcolor="#F1E8FF"></td>
<td bgcolor="#E8FFF3"></td>
<td bgcolor="#CDCDDE"></td>
</tr>
</table>
</div></td></tr></table>
</div>
<script language=javascript>
function get_cookie(name_to_get) {
var cookie_pair
var cookie_name
var cookie_value
var cookie_array = document.cookie.split("; ")
for (counter = 0; counter < cookie_array.length; counter++) {
cookie_pair = cookie_array[counter].split("=")
cookie_name = cookie_pair[0]
cookie_value = cookie_pair[1]
if (cookie_name == name_to_get) {
return unescape(cookie_value)
}
}
return null
}
var bg_color = get_cookie("bgColor_cookie")
function set_color(color_val) {
set_cookie("bgColor_cookie", color_val, 365, "https://www.jb51.net/")
}
function set_cookie(cookie_name, cookie_value, cookie_expire, cookie_path, cookie_domain, cookie_secure) {
var cookie_string = cookie_name + "=" + cookie_value
if (cookie_expire) {
var expire_date = new Date()
var ms_from_now = cookie_expire * 24 * 60 * 60 * 1000
expire_date.setTime(expire_date.getTime() + ms_from_now)
var expire_string = expire_date.toGMTString()
cookie_string += "; expires=" + expire_string
}
if (cookie_path) {
cookie_string += "; path=" + cookie_path
}
if (cookie_domain) {
cookie_string += "; domain=" + cookie_domain
}
if (cookie_secure) {
cookie_string += "; true"
}
document.cookie = cookie_string
}
if (bg_color) {
bb1.style.backgroundColor = bg_color
}
</script>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。
您可能感兴趣的文章: