下圖為簡單的網頁介面

通過新增cookie的名字，值，屬性來設定cookie

通過輸入cookie的名字來列印cookie的值

通過輸入要刪除cookie的名字來刪除cookie

以下為html

<input id="cookiename" type="text" placeholder="cookie名字"><br/>
<input id="cookiezhi" type="text" placeholder="cookie值"><br/>
<input id="cookietime" type="text" placeholder=
 
"cookie時間"><br/>
<input id="import" type="button" value="輸入"><br/>
<input id="cookienameTwo" style="height: 18px" type="text"placeholder="輸入要列印的對應cookie名字"><br>
<input id="print" type="button" value="列印">
<p></p><br/>
<input id="deletetext" type=
 
"text" placeholder="輸入要刪除的cookie值">
<input id="deleteinput" type="button" value="刪除">

以下為js

//先將html中的input標籤挨個獲取
let cName=document.getElementById("cookiename");
let cNhi=document.getElementById("cookiezhi");
let cTime=document.getElementById("cookietime");
let cImport=document.getElementById
 
("import");
let cNameTwo=document.getElementById("cookienameTwo");
let cPrint=document.getElementById("print");
let p1=document.getElementsByTagName("p")[0];
let deleteText=document.getElementById("deletetext");
let deleteInput=document.getElementById("deleteinput");
//設定輸入按鈕的單擊事件，通過單擊輸入按鈕，將對於的cookie名字，值和時間新增
cImport.addEventListener("click",function () {
    cookieDsut(cName.value,cNhi.value,cTime.value);
});
//設定輸出按鈕的單擊事件，通過單擊輸出按鈕，將對於的cookie名字的值打印出來
cPrint.addEventListener("click",function () {
    p1.innerText=cookieUdt(cNameTwo.value);
});
//設定刪除按鈕的單擊事件，通過單擊刪除按鈕，將對應的cookie名字的cookie刪除
deleteInput.addEventListener("click",function () {
    cookieDelete(deleteText.value);
});
//將傳入的名字，值，時間加入cookie中
function cookieDsut(name,value,myTime) {
    let oDate = new Date();
    oDate.setFullYear(oDate.getFullYear()+parseInt(myTime));
    document.cookie=name+"="+value+";expires="+oDate;
    console.log(document.cookie);
}
//將傳入名字對應的cookie的值返回
function cookieUdt(tkvalue) {
    let arr=document.cookie.split(";");
    for (let t=0;t<arr.length;t++){
        let arrPusp =arr[t].split("=");
        if (arrPusp[0].trim()==tkvalue){
            return arrPusp[1];
        }
    }
}
//刪除cookie
function cookieDelete(name) {
    let exp=new Date();
    exp.setDate(exp.getDate()-1);
    document.cookie=name+"="+cookieUdt(name)+";expires="+exp;
}