Javascript 基于样式表函数更改链接颜色

我是一个新手JavaScript程序员；任何帮助都将不胜感激

我已经成功地实现了一个脚本，允许用户从“常规视图”切换到“高对比度视图”。脚本只是在更改样式表

我还设置了一个基本切换脚本：当用户单击“高对比度视图”时，链接文本变为“返回”

但是，我需要修改切换的工作方式：我需要更改链接颜色，而不是更改链接文本

我知道我可以使用

.style.color

创建函数，但我不知道如何将其集成到当前脚本中

JavaScript:

function load_all() {
    var cssval;

    cssval = get_cookie("cssclass");
    if (cssval == null || (cssval != "Normal CSS" && cssval != "High-Contrast-View")) {
        cssval = "Normal CSS";
    }
    set_stylesheet(cssval);
}

function switchStyle(newtitle) {
    set_stylesheet(newtitle);
    finish_stylesheet();
}

function set_stylesheet(newtitle) {
    var csslink;

    if (newtitle == null) {
        if (get_stylesheet() == "Normal CSS") newtitle = "High-Contrast-View";
        else newtitle = "Normal CSS";
    }
    for (var i = 0; (csslink = document.getElementsByTagName("link")[i]); i++) {
        if (csslink.getAttribute("rel").indexOf("style") != -1 && csslink.getAttribute("title")) {
            csslink.disabled = true;
            if (csslink.getAttribute("title") == newtitle) 
                csslink.disabled = false;
        }
    }
    set_cookie("cssclass", newtitle, 28);
}

function finish_stylesheet() {
    var nojsanchor, nojsspan, newtitle;

    newtitle = get_stylesheet();
    nojsanchor = document.getElementById("footer_nojslink");
    nojsspan = document.getElementById("contrastToggle");
    if (nojsanchor != null && nojsspan != null) {
        while (nojsspan.hasChildNodes())  
            nojsspan.removeChild(nojsspan.childNodes[0]);
        nojsspan.appendChild(document.createTextNode(newtitle == "Normal CSS" ?  "high contrast" : "back"));
        nojsanchor.href = "javascript:switchStyle('" + (newtitle == "Normal CSS" ?  "High-Contrast-View" : "Normal CSS") + "')";
    }
}

function get_stylesheet() {
    var i, a;

    for (i=0; (a = document.getElementsByTagName("link")[i]); i++) {
        if (a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) 
            return a.getAttribute("title");
    }
    return null;
}

function accepts_cookies() {
    document.cookie = "cookiecheck=true; path=/";
    var cookies = document.cookie;
    if (cookies.indexOf("cookiecheck") >= 0) 
        return true;
    else
        return false;
}

function set_cookie(name, value, days) {
    var expire;

    if (days > 0) {
        expire = new Date();
        expire.setDate(expire.getDate() + days);
    } 
    else 
        expire = null;
    document.cookie = name + "=" + escape(value) + (expire == null ? "" : ";expires=" + expire.toGMTString()) + ";path=/";
}

function get_cookie(name) {
    var cookielist, cookie;

    cookielist = document.cookie.split(";");
    for (var i = 0; i < cookielist.length; i++) {
    cookie = cookielist[i];
        while (cookie.charAt(0) == " ") 
            cookie = cookie.substring(1);
        if (cookie.indexOf(name + "=") == 0) 
            return unescape(cookie.substring(name.length + 1));
    }
    return null;
}

函数加载_all（）{
var-cssval；
cssval=get_cookie（“cssclass”）；
if（cssval==null | |（cssval！=“正常CSS”&&cssval！=“高对比度视图”））{
cssval=“正常CSS”；
}
set_样式表（cssval）；
}
功能切换样式（newtitle）{
set_样式表（newtitle）；
完成_样式表（）；
}
函数集\样式表（newtitle）{
var-csslink；
如果（newtitle==null）{
如果（get_stylesheet（）=“Normal CSS”）newtitle=“高对比度视图”；
else newtitle=“正常CSS”；
}
对于（var i=0；（csslink=document.getElementsByTagName（“链接”）[i]）；i++）{
if（csslink.getAttribute（“rel”）.indexOf（“style”）！=-1&&csslink.getAttribute（“title”））{
csslink.disabled=true；
if（csslink.getAttribute（“title”）==newtitle）
csslink.disabled=false；
}
}
set_cookie（“cssclass”，newtitle，28）；
}
函数finish_样式表（）{
var nojsanchor、nojsspan、newtitle；
newtitle=get_stylesheet（）；
nojsanchor=document.getElementById（“footer_nojslink”）；
nojsspan=document.getElementById（“对比切换”）；
if（nojsanchor！=null&&nojsspan！=null）{
while（nojsspan.hasChildNodes（））
nojsspan.removeChild（nojsspan.childNodes[0]）；
nojsspan.appendChild（document.createTextNode（newtitle==“正常CSS”？“高对比度”：“返回”）；
nojsanchor.href=“javascript:switchStyle”（“+（newtitle==”普通CSS“？”高对比度视图）：”普通CSS“+”）”；
}
}
函数get_样式表（）{
varⅠ，a；
对于（i=0；（a=document.getElementsByTagName（“链接”）[i]）；i++）{
如果（a.getAttribute（“rel”）.indexOf（“style”）！=-1&&a.getAttribute（“title”）&&a.disabled）
返回a.getAttribute（“标题”）；
}
返回null；
}
函数接受_cookies（）{
document.cookie=“cookiecheck=true；path=/”；
var cookies=document.cookie；
如果（cookies.indexOf（“cookiecheck”）>=0）
返回true；
其他的
返回false；
}
函数集\u cookie（名称、值、天数）{
var到期；
如果（天数>0）{
expire=新日期（）；
expire.setDate（expire.getDate（）+天）；
} 
其他的
expire=null；
document.cookie=name+“=”+escape（value）+（expire==null？”：“expires=“+expire.togmString（））+“path=/”；
}
函数get_cookie（名称）{
var cookielist，cookie；
cookielist=document.cookie.split（“；”）；
对于（变量i=0；i

使用当前代码，您应该能够执行以下操作：

document.getElementById("footer_nojslink").style.color = "#A6A6A6";

如果您发现自己经常做这种工作，那么花时间学习jQuery是值得的。它有时可以使事情变得简单，并消除大多数跨浏览器的麻烦。下面是一个jQuery示例，用于您询问的特定示例，更改链接颜色

$('#footer_nojslink').css('color','#A6A6A6');

---

使用当前代码，您应该能够执行以下操作：

document.getElementById("footer_nojslink").style.color = "#A6A6A6";

如果您发现自己经常做这种工作，那么花时间学习jQuery是值得的。它有时可以使事情变得简单，并消除大多数跨浏览器的麻烦。下面是一个jQuery示例，用于您询问的特定示例，更改链接颜色

$('#footer_nojslink').css('color','#A6A6A6');

轻松的

导入两个（或更多）样式表

<head>
<link rel="stylesheet" href="style_1.css">
<link rel="stylesheet" href="style_2.css">
</head>

然后通过以下方式启用/禁用它们：

<script>
document.styleSheets[0].disabled=true;
document.styleSheets[1].enabled=true;
</script>

document.styleSheets[0]。disabled=true；
document.styleSheets[1]。enabled=true；

现在，您可以更改站点的整个样式，而不仅仅是链接

简单

导入两个（或更多）样式表

<head>
<link rel="stylesheet" href="style_1.css">
<link rel="stylesheet" href="style_2.css">
</head>

然后通过以下方式启用/禁用它们：

<script>
document.styleSheets[0].disabled=true;
document.styleSheets[1].enabled=true;
</script>

document.styleSheets[0]。disabled=true；
document.styleSheets[1]。enabled=true；

现在，您可以更改站点的整个样式，而不仅仅是链接

---

谢谢。非常感谢您的建议/咆哮和回答。他只想改变颜色。在依靠图书馆为他做任何事情之前，他应该先学习基础知识。虽然JQuery很酷，很有用，并且受到世界各地web开发人员的喜爱，但应该鼓励初学者深入挖掘并学习javascript的基本特性、优势和劣势+谢谢你给了我正确的答案，但是我认为你应该编辑以减少你的“咆哮”的显著性。你的正确的乔和我自己就是一个很好的例子。我马上就知道如何在jQuery中实现它，但我必须查找如何使用纯javascript实现它。编辑后将答案放在顶部。谢谢。非常感谢您的建议/咆哮和回答。他只想改变颜色。在依靠图书馆为他做任何事情之前，他应该先学习基础知识。虽然JQuery很酷，很有用，并且受到世界各地web开发人员的喜爱，但应该鼓励初学者深入挖掘并学习javascript的基本特性、优势和劣势+谢谢你给了我正确的答案，但是我认为你应该编辑以减少你的“咆哮”的显著性。你的正确的乔和我自己就是一个很好的例子。我马上就知道该怎么做了