{"id":1017,"date":"2017-03-13T17:27:41","date_gmt":"2017-03-13T09:27:41","guid":{"rendered":"http:\/\/www.qdabc.cn\/?p=1017"},"modified":"2017-03-13T17:27:41","modified_gmt":"2017-03-13T09:27:41","slug":"cookies%e5%ad%98%e5%82%a8%e9%80%89%e9%a1%b9%e5%8d%a1","status":"publish","type":"post","link":"http:\/\/www.qdabc.cn\/?p=1017","title":{"rendered":"cookies\u5b58\u50a8\u9009\u9879\u5361"},"content":{"rendered":"
<!DOCTYPE html>\r\n<html>\r\n<head>\r\n    <meta charset=\"utf-8\">\r\n    <title>cookie_tab<\/title>\r\n    <style>\r\n        * {\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n        body {\r\n            color: #FFF;\r\n        }\r\n        ul,li {\r\n            list-style: none;\r\n        }\r\n        .fl {\r\n            float: left;\r\n        }\r\n        .tab {\r\n            margin: 0 auto;\r\n            overflow: hidden;\r\n            width: 600px;\r\n            height: 300px;\r\n            text-align: center;\r\n        }\r\n        .tab-ctrl {\r\n            display: flex;\r\n            width: 100%;\r\n            height: 60px;\r\n            line-height: 60px;\r\n            flex: 1;\r\n        }\r\n        .tab-ctrl li {\r\n            flex: 1;\r\n            background-color: #CCC;\r\n        }\r\n        .tab-ctrl li.on {\r\n            background-color: #666;\r\n        }\r\n        .tab-con {\r\n            width: 100%;\r\n            height: 240px;\r\n            line-height: 240px;\r\n            flex: 1;\r\n            background-color: #999;\r\n        }\r\n        .tab-con li {\r\n            display: none;\r\n            width:100%;\r\n            height: 100%;\r\n        }\r\n        .tab-con li.active{\r\n            display: block;\r\n        }\r\n\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <div id=\"tab1\" class=\"tab\">\r\n        <ul class=\"tab-ctrl fl\">\r\n            <li class=\"on\">1<\/li>\r\n            <li>2<\/li>\r\n            <li>3<\/li>\r\n        <\/ul>\r\n        <ul class=\"tab-con fl\">\r\n            <li class=\"active\">1<\/li>\r\n            <li>2<\/li>\r\n            <li>3<\/li>\r\n        <\/ul>\r\n    <\/div>\r\n    <script>\r\n        \/\/01 DOMready\u51fd\u6570\r\n        function domReady(fn) {\r\n            if(document.addEventListener) {\r\n                document.addEventListener('DOMContentLoaded',function(){\r\n                    document.removeEventListener('DOMContentLoaded',arguments.callee,false);\r\n                    fn();\r\n                },false);\r\n            } else {\r\n                document.onreadystatechange = function() {\r\n                    if(this.readyState == 'complete') {\r\n                        fn();\r\n                        document.onreadystatechange = null;\r\n                    }\r\n                };\r\n            }\r\n        }\r\n        \/\/02 \u5c01\u88c5cookie\u7c7b \uff08\u529f\u80fd\uff1a \u5b58\u50a8\uff0c\u67e5\u8be2\uff0c\u5220\u9664\uff09\r\n        var ck = {\r\n            set: function(key,value,expires,path) {\r\n                var oDate = new Date();\r\n                var defaultExpire = expires || 30;\r\n                oDate.setTime(oDate.getTime()  + defaultExpire*24*60*60*1000);\r\n                expires = oDate.toGMTString();\r\n                path = path || '\/';\r\n                document.cookie = key + '=' + value + '; EXPIRES=' + expires + '; PATH=' + path + '; ';\r\n            },\r\n            select:function(key) {\r\n                var cookieStr = document.cookie;\r\n                cookieStr = cookieStr.replace(\/\\s+\/g,'');\r\n                var tempValue = '';\r\n                var arr = cookieStr.split(';');\r\n                for(var i=0; i<arr.length; i++){\r\n                    if(arr[i].split('=')[0] === key){\r\n                        tempValue = arr[i].split('=')[1];\r\n                    }\r\n                }\r\n                return tempValue;\r\n            },\r\n            delete:function(key) {\r\n                var oDate = new Date('1970-1-1');\r\n                document.cookie = key + '=' + '.' + '; EXPIRES=' + oDate.toGMTString() + '; PATH=\/; ';\r\n            }\r\n        };\r\n        \/\/03 \u5220\u9664class\u7684\u65b9\u6cd5\r\n        function deleteClass(domEle,className){\r\n            var classStr = domEle.className;\r\n            var regExp = new RegExp('\\\\b'+ className +'\\\\b');\r\n            domEle.className = classStr.replace(regExp,'');\r\n        }\r\n        \/\/04 \u6839\u636eclass\u9009\u62e9\u5143\u7d20\u7684\u65b9\u6cd5\r\n        function getByClass(ele,className) {\r\n            if(ele.getElementsByClassName){\r\n                return ele.getElementsByClassName(className);\r\n            }else{\r\n                var resultArr = [];\r\n                var eleArr = ele.getElementsByTagName('*');\r\n                var regExp = new RegExp('\\\\b'+ className +'\\\\b');\r\n                for(var i=0; i<eleArr.length; i++){\r\n                    if(regExp.test(eleArr[i].className)){\r\n                        resultArr.push(eleArr[i]);\r\n                    }\r\n                }\r\n                return resultArr;\r\n            }\r\n        }\r\n        \/\/05 \u5b9e\u73b0\u9009\u9879\u5361\r\n        domReady(function(){\r\n            var oTab1 = document.getElementById('tab1');\r\n            var aCtrl = oTab1.querySelectorAll('.tab-ctrl li');\r\n            var aCon = oTab1.querySelectorAll('.tab-con li');\r\n\r\n            \/\/ tab \u5b9e\u73b0\u65b9\u6cd5\r\n            function tab(index){\r\n                for(var i=0; i<aCtrl.length; i++){\r\n                    deleteClass(aCtrl[i],'on');\r\n                    aCon[i].style.display = 'none';\r\n                }\r\n                aCtrl[index].className = aCtrl[index].className + ' on';\r\n                aCon[index].style.display = 'block';\r\n            }\r\n\r\n            var tabIndexs = parseInt(ck.select('tab_index'));\r\n            console.log(tabIndexs);\r\n            if(tabIndexs || tabIndexs == 0){\r\n                tab(tabIndexs);\r\n            }\r\n\r\n            for(var i=0; i<aCtrl.length; i++){\r\n                (function(index){\r\n                    aCtrl[i].onclick = function(){\r\n                        ck.set('tab_index',index);\r\n                        tab(index);\r\n                    }\r\n                })(i);\r\n            }\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html><\/pre>\n
\u6b22\u8fce\u5206\u4eab\u672c\u6587\uff0c\u8f6c\u8f7d\u8bf7\u4fdd\u7559\u51fa\u5904\uff1a\u524d\u7aefABC<\/a> » cookies\u5b58\u50a8\u9009\u9879\u5361<\/a><\/p>","protected":false},"excerpt":{"rendered":"
<!DOCTYPE html> <html> <head> <meta charset=”utf-8″> <title>cookie_tab […]<\/p>\n","protected":false},"author":1,"featured_media":102,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[67],"_links":{"self":[{"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/posts\/1017"}],"collection":[{"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1017"}],"version-history":[{"count":1,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/posts\/1017\/revisions"}],"predecessor-version":[{"id":1018,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/posts\/1017\/revisions\/1018"}],"wp:featuredmedia":[{"embeddable":true,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=\/wp\/v2\/media\/102"}],"wp:attachment":[{"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1017"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1017"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.qdabc.cn\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1017"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}