HTML設定點選超連結變成灰色的方法：先載入尋找超連結的函式；然後用【
本教學操作環境：windows7系統、html5版，DELL G3電腦。
HTML設定點擊超連結變成灰色的方法：
#一、尋找HTML超連結
要想讓超連結失效變灰色，首先要做的事情是找到超連結。尋找超連結的方法有很多，如果採用W3C的方法，就是如下寫法：
document.getElementsByTagName("a") 如果覺得W3C的方法太長了或不美觀，可以使用一些JavaScript函式庫，例如jQuery或Mootools。這樣取得超連結就非常簡潔。
您也可以使用在<a></a>標籤上加上ID的方式，但是有個小缺點。如果您是針對全篇的超鏈接，這種加ID的方式就增大了工作量。
二、改變HTML超連結
找到超連結之後，接下來要做的事情就是改變超鏈接，使其失效並且變成灰色。讓超連結失效的方式有好幾種，最常見的就是把href屬性設為「#」。實際上這種方式根本就沒有改變超鏈接，只是使得href屬性沒有指向一個合理的鏈接而已。
真正改變超連結的方式是讓其變成普通文本，而且文字的字體顏色是灰色的。如同以下效果：
好了，閒話就不扯了，讓我們進入正題。下面的程式碼是HTML文件一載入完畢就立刻執行函數。
var addLoadEvent=function(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
};這個函數是為了後面載入尋找超連結的函數。下面是獲取HTML文件中超鏈接，並且使其失效變灰色。
var getLinks=function() {
if(!document.getElementsByTagName)return false;
if(!document.createElement)return false;
if(!document.getElementsByName("a"))return false;
var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
//判断href属性是否包含“#”符号
if ((links[i].getAttribute("href").indexOf("#")) >= 0) {
var para = document.createElement("p");
var fon = document.createElement("font");
fon.setAttribute("color", "#808080");
fon.innerHTML =links[i].lastChild.nodeValue;
var content = para.appendChild(fon);
replaceEach(links[i], content);
} else {
links[i].style.color = "990033";
}
}
};透過閱讀上述程式碼，相信讀者已經明白了。改變超連結的方式其實是用
取代了標籤。並且在 標籤中內嵌了標籤，的顏色設為了灰色，就達到了我們想要的效果。 其中用到了替換函數replaceEach，下面給出replaceEach函數的程式碼。 最後別忘記了最重要的一步，在addLoadEvent函數中載入尋找函數，如下： 相關學習推薦：html影片教學 以上是HTML如何設定點擊超連結變成灰色的詳細內容。更多資訊請關注PHP中文網其他相關文章！//替换HTML元素
var replaceEach=function(targetNode, newNode) {
var targetParentNode = targetNode.parentNode;
var newParentNode = newNode.parentNode;
//若 targetParentNode 和 newParentNode 都存在父节点
if (targetParentNode && newParentNode) {
targetParentNode.replaceChild(newNode.cloneNode(true), targetNode);
} else {
newParentNode.replaceChild(targetNode, newNode);
}
};登入後複製addLoadEvent(getLinks);
登入後複製
