HTML DOM 快速導覽 - 文件物件 document 的屬性 alinkColor

document.alinkColor 回傳連結 <a> 元素 (element) 在滑鼠點擊瞬間顏色的物件,原本此樣式 (style) 由 CSS 的 :active 設定。



舉例如下
function run() {
    var c = randomColor();
    document.getElementById("show").innerHTML = "<br / >" + c;
    document.alinkColor = c;
}

function randomColor() {
    var c1 = (Math.random() * 1000) % 256;
    var c2 = (Math.random() * 1000) % 256;
    var c3 = (Math.random() * 1000) % 256;
    c1 = hex(Math.floor(c1));
    c2 = hex(Math.floor(c2));
    c3 = hex(Math.floor(c3));
    return "#" + c1 + c2 + c3;
}

function hex(n) {
    var result = "";
    var temp, count;
    while (n > 16) {
        count = 1;
        while (n > exp(16, count)) {
            count += 1;
        }
        count -= 1;
        temp = n / exp(16, count);
        temp = Math.floor(temp);
        result += hexLetter(temp);
        n -= exp(16, count) * temp;
    }
    if (n == 16) {
        result += "1";
        n -= 16;
    }
    result += hexLetter(n);
    
    return result;
}

function hexLetter(n) {
    if (n >= 16 || n < 0) {
        return "";
    }
    else {
        switch (n) {
            case 10:
                return "A";
            case 11:
                return "B";
            case 12:
                return "C";
            case 13:
                return "D";
            case 14:
                return "E";
            case 15:
                return "F";
            default:
                return "" + n;
        }
    }
}

function exp(x, y) {
    var result = 1;
    while (y > 0) {
        result *= x;
        y -= 1;
    }
    
    return result;
}

/* 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:document002.js
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 */


此例是藉由 randomColor() 函數 (function) 產生隨機的顏色,然後在 run() 中
document.getElementById("show").innerHTML = "<br / >" + c;
document.alinkColor = c;


先在 id 屬性 (attribute) 為 show 的元素顯示顏色的十六進位數字,然後將此顏色指派給 alinkColor 。


我們以下面的 HTML 文件載入
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM DEMO</title>
<script src="document002.js" type="text/javascript"></script>
</head>
<body>
<input type="button" value="RUN" onclick="run();">
<a href="http://www.google.com.tw/">Google</a>
<span id="show"></span>
</body>
</html>

<!-- 《程式語言教學誌》的範例程式
     http://pydoing.blogspot.com/
     檔名:document002.html
     功能:示範 JavaScript 程式 
     作者:張凱慶
     時間:西元 2011 年 8 月 -->


瀏覽器 (broswer) 開啟,首先,點擊 RUN 取得隨機顏色



然後按下連結的瞬間,連結會變成剛才取得的隨機顏色



中英文術語對照
元素element
樣式style
函數function
屬性attribute
瀏覽器broswer


您可以繼續參考
基本概念
文件物件 document


相關目錄
HTML DOM 快速導覽
JavaScript 教材
首頁


參考資料
https://developer.mozilla.org/en/DOM/document.alinkColor
http://msdn.microsoft.com/en-us/library/ms533071(VS.85).aspx

沒有留言: