jQuery利用cookie实现更换网页背景的换肤特效代码

浏览：886次- 评论：0次- 发布时间：2019-08-30

Html

Css


	
		更换背景：

$(document).ready(function() {
	//为了安全 google chrome 等浏览器是禁止本地文件写Cookie的即file:///F:/Lord%20community/test/Untitled-2.html这样的以file开头的是不能写本地文件的
	var cookieClass = getCookie('class'); //读取需要缓存的对象。
	$("body").attr("class", cookieClass); //
	$(".skin_list li").each(function() {
		$(this).click(function() {
			var className = $(this).attr("class"); //保存当前选择的类名
			$("body").attr("class", className, 30); //把选中的类名给body

function SetCookie(name, value, day) //两个参数，一个是cookie的名子，一个是值
			{
				var exp = new Date(); //new Date("December 31, 9998");
				exp.setTime(exp.getTime() + day * 24 * 60 * 60 * 1000);
				document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
			}
			SetCookie("class", className, 30);
		})
	});
});

function getCookie(name) //取cookies函数       
{
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for (var i = 0; i < ca.length; i++) {
		var c = ca[i];
		while (c.charAt(0) == ' ') c = c.substring(1, c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
	}
	return null;
}

↑上面代码改变，会自动显示代码结果

jQuery调用版本：1.11.3

立即下载收藏

积分说明：注册即送10牛币，每日签到可获得5牛币，成为VIP会员可永久免牛币下载！充值积分充值会员更多说明»

代码描述：jquery利用cookie实现更换网页背景的换肤特效代码实现换皮肤的效果，点击想要的颜色然后网页就换那个主题颜色，并且可以保存这个状态的，这样类似的换肤效果其实是比较容易的，就是利用cookie保存用户操作的状态，然后再读取保存的值。

实现换皮肤的效果，点击想要的颜色然后网页就换那个主题颜色，并且可以保存这个状态的，这样类似的换肤效果其实是比较容易的，就是利用cookie保存用户操作的状态，然后再读取保存的值。

讨论这个常用代码（0）回答他人问题或分享心得会奖励牛币

〒_〒居然一个评论都没有……

文明上网，理性发言！ 😉 阿里云幸运券，戳我领取