的Javascript改變CSS頁面保存基於cookie的

Question

好吧，夥計！下面是這個問題的基本要點是：

我希望建立在用戶的計算機被稱爲光標一個cookie在默認情況下的是價值。然後，我想在主頁上創建兩個按鈕。其中一人會說「將光標更改爲默認值」，另一人會說「將光標更改爲新的。」

他們既能修改光標的cookie。如果cookie的值設置爲yes，它將加載主CSS頁面。否則，它將加載一個替代的CSS頁面。

下面是這似乎是我試圖不工作：

在head標籤：

<link type="text/css" rel="stylesheet" href="http://example.com/main.css" /> 
<script type="text/javascript"> 
    window.onload = function() { 

window.onload = function() { 
var curcookie=getCookie("cursor"); 
if (curcookie===null) { 
    curcookie = ""; 
} 
if(curcookie === "no") { 
    changecookie(); 
} 
function getCookie(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); 
    if (c.indexOf(nameEQ) != -1) return c.substring(nameEQ.length,c.length); 
} 
return null; 
} 
function changecookie() { 
    var oldlink = document.getElementsByTagName("link").item(5); 
    var newlink = document.createElement("link"); 
    newlink.setAttribute("rel", "stylesheet"); 
    newlink.setAttribute("type", "text/css"); 
    newlink.setAttribute("href", "http://example.com/alt.css"); 
    document.getElementsByTagName("head").item(0).replaceChild(newlink, oldlink); 
} 
</script> 

在身體標記：

<script type="text/javascript"> 
    document.getElementById("cursoroptions").innerHTML = ("<input type=\"button\" value=\"Change the cursor to default\" onclick=\"document.cookie = \"cursor=no\"\"" /><br /><input type=\"button\" value=\"Change the cursor to new\" onclick=\"document.cookie = \"cursor=yes\"\"" />); 
</script> 
<div id="cursoroptions"></div> 

另外一個需要注意的是，如果這意味着什麼，我正在使用GoDaddy。 我希望這是信息是不夠好。如果沒有，請告訴我。

謝謝！

更新：

感謝您所有的幫助，阿克沙伊！ 使用你說什麼，我就知道，這裏是爲我工作的最終代碼。

document.getElementsByTagName("head")[0].setAttribute("id", "linkcss"); 
Hellocookie(); 

function Hellocookie() { 
    var curcookie = getCookie("cursor"); 
    if (curcookie === null) { 
     curcookie = ""; 
    } 
    if (curcookie === "no") { 
     changecss2(); 
    } 
    else { 
     changecss1(); 
    } 
} 

function getCookie(cname) { 
    var name = cname + "="; 
    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); 
     if (c.indexOf(name) === 0) return c.substring(name.length,c.length); 
    } 
    return ""; 
} 

function changecss1() { 
    document.getElementById("linkcss").innerHTML += ('<link rel="stylesheet" type="text/css" href="http://example.com/firstcss.css">'); 
} 

function changecss2() { 
    document.getElementById("linkcss").innerHTML += ('<link rel="stylesheet" type="text/css" href="http://example.com/secondcss.css">'); 
} 

至於按鈕：

<script type="text/javascript"> 
    window.addEventListener("load", function(evt) {document.getElementById("cursoroptions").innerHTML = ("<input type=\"button\" class=\"mysubmitbutton\" value=\"Change the cursor to default\" onclick=\'document.cookie=\"cursor=no\"' /><br /><input type=\"button\" class=\"mysubmitbutton\" value=\"Change the cursor to Lazybott\" onclick=\'document.cookie = \"cursor=yes\"' />");}) 
</script> 
<div id="cursoroptions"></div> 

Answer 1

你的JavaScript代碼的格式錯誤。

您不關閉您的括號，和你正在編寫onload兩次。這就是爲什麼你的代碼無法工作。而且你在這裏用雙引號代替單引號。

onclick=\"document.cookie = \"cursor=no\"\"" 

但是你應該使用。

onclick=\'document.cookie=\"cursor=no\"' 

下面是正確的代碼。

<link type="text/css" rel="stylesheet" href="http://example.com/main.css" /> 
<script type="text/javascript"> 
window.onload = function() { 

    var curcookie = getCookie("cursor"); 
    if (curcookie == null) { 
    curcookie = ""; 
    } 
    if (curcookie == "no") { 
    changecookie(); 
    } 
}; 

function getCookie(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); 
    if (c.indexOf(nameEQ) != -1) return c.substring(nameEQ.length, c.length); 
    } 

}; 

function changecookie() { 
    var oldlink = document.getElementsByTagName("link").item(0); 
    oldlink.href = 'http://example.com/alt.css'; 

}; 
</script> 

body標籤：

<script type="text/javascript"> 
    document.getElementById("cursoroptions").innerHTML = ("<input type=\"button\" value=\"Change the cursor to default\" onclick=\'document.cookie=\"cursor=no\"' /><br /><input type=\"button\" value=\"Change the cursor to new\" onclick=\'document.cookie = \"cursor=yes\"' />"); 
</script> 
<div id="cursoroptions"></div> 

Working fiddle