如何删除现有的类名并添加一个带有jQuery和cookie的新名称？

如何删除类名并将其替换为新名称？

 .red {background-color: #FF0000;} .green{background-color: #00FF00;} .blue {background-color: #0000FF;}   
 
red
 
green
 
blue
 
  

在这种情况下，当您单击红色或绿色或蓝色时，正文类名称将相应更改。 它还会制作一个可以节省选择的cookie。

我尝试了jQuery .addClass并且它正在工作，但是它在现有的类之上添加了一个类。 此外，我无法保存cookie。

Answer 1

使用：

 $('.red').removeClass('red').addClass('blue'); 

这是完整的工作代码 ：

 $(function() { $("a").click(function() { var color = $(this).text(); $("body").removeClass().addClass(color); return false; }); }); 

现在为cookie部分

 $(function() { $("a").click(function() { var color = $(this).text(); $("body").removeClass().addClass(color); createCookie("color",color); return false; }); if (readCookie("color") != null) { $("body").removeClass().addClass(readCookie("color")); } else { $("body").removeClass().addClass("red"); } }); function createCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name) { 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; } function eraseCookie(name) { createCookie(name,"",-1); } 

这里的工作示例 。 感谢QuirksMode预先制作的cookie代码（cookie-cutter cookie代码？）

Answer 2

如果没有jQuery，您可以使用以下简单的行来完成此操作：

 document.getElementsByTagName("body")[0].className = "red"; 

这有效地删除了分配给元素的类，并将其替换为您想要的任何内容。

对于cookie， PPK有一些简单的方法来读/写/删除cookie 。

 createCookie("mySiteCookie", "red", 7); // Set the cookie to expire in 7 days. readCookie("mySiteCookie"); // Should yield "red" 

Answer 3

你还需要removeClass 。

Answer 4

Russ Cam的回答和Hank Gay的回答将会有所帮助。 对于cookie，您可以使用jQuery cookie插件 。

您应该能够按照有关如何根据需要设置和读取cookie的示例进行操作。