[英]color switcher in mootools OR jquery
这是我简单的javascript函数切换颜色,它工作正常,但我需要在我的网站启用jquery或mootools然后更好地使这个功能现代化
function changeThemeColor(color)
{
switch(color)
{
case "style1":
default:
document.getElementById('CSSfile').href = 'css/style1.css';
setCookie('ThemeColor','style1',7);
break;
case "style2":
document.getElementById('CSSfile').href = 'css/style2.css';
setCookie('ThemeColor','style6',7);
break;
}
}
我知道这可能是一个巨大的任务,但我真的需要将此代码转换为jquery或mootools
对于MooTools:
function changeThemeColor(color)
{
switch(color)
{
case "style1":
default:
$('CSSfile').set('href','css/style1.css');
Cookie.write('ThemeColor','style1',{'duration':7});
break;
case "style2":
$('CSSfile').set('href','css/style2.css');
Cookie.write('ThemeColor','style6',{'duration':7});
break;
}
}
正如你所看到的,编辑是如此之小,如果我是你,我甚至都不愿意实施它们。 这也不会让你的网站更具前瞻性。
如果你想使用jQuery改变这个
document.getElementById('CSSfile').href = 'css/style1.css';
至
$("#CSSfile").attr("href",'css/style1.css');
如果你想改变div的颜色是
$("#divId").css("color","#f0f0f0")
对不起我的英语,我来自阿根廷
编辑: http : //plugins.jquery.com/project/Cookie这里有一个cookie的jQuery插件
如果您的代码有效,那么为什么要将它转换为库代码,以便将其转换回您所拥有的代码?
如果这实际上是您的代码的样子,您可以摆脱一些冗余:
function changeThemeColor(color) {
document.getElementById('CSSfile').href = 'css/' + color + '.css';
switch(color) {
case "style1":
default:
setCookie('ThemeColor','style1',7);
break;
case "style2":
setCookie('ThemeColor','style6',7);
break;
}
}
style2
将'style6'
发送到setCookie()
。 如果这是一个错误,它应该发送'style2'
,你可以进一步减少它。
function changeThemeColor(color) {
document.getElementById('CSSfile').href = 'css/' + color + '.css';
setCookie('ThemeColor', color, 7);
}
对于mootools(或者实际上是jquery),我会创建一个样式的地图,并执行以下操作:
var changeThemeColor = function(colour) {
var colours = { // set your mapping here.
style1: "style1",
style2: "style6"
}, style = colours[colour] || colours['style1']; // default to style1 if not mapped
document.id("CSSfile").set("href", "css/"+style+ ".css");
Cookie.write("ThemeColor", style, {
duration: 7,
path: "/"
});
};
试图使其更加模块化/基于模式,以便它可以轻松支持将来添加新样式。 最好的方法是通过一个options
var作为第二个参数,你可以覆盖(外部)默认映射,在内部,执行Object.merge()
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.