마지막 글: JS를 사용해 쿠키 코드 공유 및 상세 댓글 읽기, 쓰기, 삭제, 실무에서 몇 가지 문제점 발견:
1. 로컬 파일의 쿠키는 Firefox에서만 디버깅할 수 있으며 IE 및 Chrome에서는 유효하지 않습니다.
2. 쿠키는 만료되지 않도록 설정되어 있습니다. 만료되기 전의 기간만 설정하는 것으로 간주되므로 이는 명백히 불합리합니다.
이번에는 좀 더 합리적인 쿠키 운영 코드를 제공합니다:
var 쿠키 = {
가져오기: 함수(k) {
return ((new RegExp(["(?:; )?", k, "=([^;]*);?"].join(""))).test(document.cookie) && RegExp[" $1"]) || "";
},
집합: 함수(k, v, e, d) {
var date=new 날짜()
varexpiresDays=e
date.setTime(date.getTime()expiresDays*24*3600*1000)
//쿠키는 설정된 시간이 있으면 지정된 시간 내에 사용되며, 그렇지 않으면 만료되지 않습니다
document.cookie=k "=" v "; 만료=" (e != '' ? date.toGMTString(): "GMT_String") ";path=/;domain=" (d||'');
},
del: 함수(k) {
var date=new 날짜()
//날짜를 과거 시간으로 설정
date.setTime(date.getTime()-10000)
document.cookie=k "=; 만료=" 날짜.toGMTString()
}
};
예제에서는 텍스트를 클릭하여 내용을 확장하고 다시 클릭하여 숨깁니다. 콘텐츠가 숨겨져 있으면 다음에 열 때 콘텐츠가 계속 숨겨집니다. 콘텐츠가 표시되면 다음에 열 때에도 계속 표시됩니다.
확장한 후에는 여기에서 콘텐츠를 볼 수 있습니다
var btn = document.getElementsByTagName('h3')[0];
btn.addEventListener('클릭',function(){
var isClose = this.getAttribute('data-isClose');
if(isClose == '닫기'){
표시();
Cookie.del('플래그');
}그밖에{
숨기기();
Cookie.set('flag','hide');
}
});
var tabCon = document.getElementById('tabCon');
함수 표시(){
tabCon.style.display = '차단';
btn.setAttribute('data-isClose','open');
btn.innerHTML = '축소';
}
함수 hide(){
tabCon.style.display = '없음';
btn.setAttribute('data-isClose','close');
btn.innerHTML = '확장';
}
var 플래그 = Cookie.get('flag');
if(플래그 == '숨기기'){
숨기기();
}