The js cookie operation method mainly involves setting, reading, expiration, and deleting cookie values. The following section summarizes some common js cookie operation application instances, I hope it will help you both in depth.
Today, we will write how to use js to set, read, and delete cookies. The code in this article comes from the Internet and is attached with common cases of cookie skin replacement on the web page for learning.
Set cookie
| The Code is as follows: |
Copy code |
Function setCookie (name, value, days ){
// Three parameters: cookie name, value, and number of days
Var exp = new Date (); // new Date ("December 31,999 8 ");
Exp. setTime (exp. getTime () + days x 24x60*60*1000 );
Document. cookie = name + "=" + escape (value) + "; expires =" + exp. toGMTString ();
} Read cookie
Function getCookie (name ){
// Cookies Function
Var arr = document. cookie. match (new RegExp ("(^ |)" + name + "= ([^;] *) (; | $ )"));
If (arr! = Null)
Return unescape (arr [2]);
Return null;
} |
Delete cookie
| The Code is as follows: |
Copy code |
Function delCookie (name ){
// Delete the cookie and try again
// Check whether the cookie is set. If so, adjust the expiration time to the past time;
// Leave the cookie to the operating system for proper time.
If (getCookie (name ))
{
Document. cookie = name + "=" + "; expires = Thu, 01-Jan-70 00:00:01 GMT ";
}
} |
Read cookie
| The Code is as follows: |
Copy code |
<! 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-Type" content = "text/html; charset = UTF-8"/>
<Title> test the cookie reading function of JavaScript </title>
<Link href = "css/08nzfh-style.css" rel = "stylesheet" type = "text/css"/>
<Style type = "text/css">
<! --
. STYLE1 {color: # FF0000}
-->
</Style>
</Head> <Body> <Div class = "personality">
<Script type = "text/javascript">
// <! [CDATA [
Function setCookie (name, value)
{
Var Days = 30; // This cookie will be saved for 30 Days
Var exp = new Date (); // new Date ("December 31,999 8 ");
Exp. setTime (exp. getTime () + Days x 24x60*60*1000 );
Document. cookie = name + "=" + escape (value) + "; expires =" + exp. toGMTString ();
} Function getCookie2 (objName) {// obtain the cookie value of the specified name
Var arrStr = document. cookie. split (";");
For (var I = 0; I <arrStr. length; I ++ ){
Var temp = arrStr <I>. split ("= ");
If (temp [0] = objName) return unescape (temp [1]);
}
} Var _ B = false;
// SetCookie ("mycookie", "mycookie ");
If (typeof (getCookie2 ("mycookie2 "))! = 'Undefined ')
{
Alert (typeof (getCookie2 ("mycookie2 ")));
_ B = true;
}
Alert (_ B );
If (_ B ){
Document. write ('<iframe id = "iframe_email" name = "iframe_email" frameborder = "0" scrolling = "no" src = "http: // localhost: 8008/vote1.4/test_8.jsp "height =" 100% "width =" 100% "> </iframe> ');
} Else {
Document. write ('<iframe src = "#" style = "display: none;"> </iframe> log on ');
}
//]>
</Script> </Body>
</Html> |
Use cookies for skin replacement
In addition to the above Code, the following is the key code of the skin replacement system.
| The Code is as follows: |
Copy code |
Var themes = {
'Gray ': 'tpl/gray.css ',
'Black': 'tpl/black.css ',
'Bootstrap ': 'tpl/bootstrap.css ',
'Default': 'tpl/default.css ',
'Metro ': 'tpl/metro.css'
}; Var skins = $ ('. li-skinitem span'). click (function (){
Var $ this = $ (this );
If ($ this. hasClass ('cs-skin-on') return;
Skins. removeClass ('cs-skin-on ');
$ This. addClass ('cs-skin-on ');
Var skin = $ this. attr ('rel ');
$ ('# Swicth-style'). attr ('href', themes [skin]);
SetCookie ('cs-skin', skin );
Skin = 'dark-hive '? Certificate ('.cs-north-logo'0000.css ('color', '# ffff'): Certificate ('.cs-north-logo'0000.css ('color',' #000000 ');
}); If (getCookie ('cs-skin ')){
Var skin = getCookie ('cs-skin ');
$ ('# Swicth-style'). attr ('href', themes [skin]);
$ This = $ ('. li-skinitem span [rel =' + skin + ']');
$ This. addClass ('cs-skin-on ');
Skin = 'dark-hive '? Certificate ('.cs-north-logo'0000.css ('color', '# ffff'): Certificate ('.cs-north-logo'0000.css ('color',' #000000 ');
} |
I changed the front-end toolbox to support skin replacement. However, the css of skin details still needs to be improved.
Front-end development tools
Update
Find a simple code on the internet, paste it first, and study it later.
| The Code is as follows: |
Copy code |
<Script>
Cookie =
{
Get: function (k) {return (new RegExp (["(? :;)? ", K," = ([^;] *);? "]. Join (" "). test (document. cookie) & RegExp [" $1 "]) | "";},
Set: function (k, v, e, d) {document. cookie = [k, "=", v, e & e ["toGMTString"]? '; Expires =' + e. toGMTString (): "", "; path =/; domain =", d | ""]. join ("");}
};
// Write Cookie
Cookie. set ("UserID", "Hello hooyes ");
// Read Cookie
Var value = Cookie. get ("UserID ");
Alert (value); // Hello hooyes! </Script> |
