javascript - 让 Javascript 只在一些特定的 div 中工作

Question

我找到了这个 javascript 代码，用于在悬停时使链接变得丰富多彩。我想在页面上使用它，但我不希望它在每个 div 上都起作用。是否可以仅针对某些特定的 div 禁用和/或启用以下代码？

谢谢!!

<script type='text/javascript'>
//<![CDATA[
var rate = 50;
if (document.getElementById)
    window.onerror = new Function("return true")

var objActive; // The object which event occured in 
var act = 0; // Flag during the action 
var elmH = 0; // Hue 
var elmS = 128; // Saturation 
var elmV = 255; // Value 
var clrOrg; // A color before the change 
var TimerID; // Timer ID
if (document.all) {
    document.onmouseover = doRainbowAnchor;
    document.onmouseout = stopRainbowAnchor;
}
else if (document.getElementById) {
    document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
    document.onmouseover = Mozilla_doRainbowAnchor;
    document.onmouseout = Mozilla_stopRainbowAnchor;
}
function doRainbow(obj) {
    if (act == 0) {
        act = 1;
        if (obj)
            objActive = obj;
        else
            objActive = event.srcElement;
        clrOrg = objActive.style.color;
        TimerID = setInterval("ChangeColor()", 100);
    }
}
function stopRainbow() {
    if (act) {
        objActive.style.color = clrOrg;
        clearInterval(TimerID);
        act = 0;
    }
}
function doRainbowAnchor() {
    if (act == 0) {
        var obj = event.srcElement;
        while (obj.tagName != 'A' && obj.tagName != 'BODY') {
            obj = obj.parentElement;
            if (obj.tagName == 'A' || obj.tagName == 'BODY')
                break;
        }
        if (obj.tagName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = objActive.style.color;
            TimerID = setInterval("ChangeColor()", 100);
        }
    }
}
function stopRainbowAnchor() {
    if (act) {
        if (objActive.tagName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}
function Mozilla_doRainbowAnchor(e) {
    if (act == 0) {
        obj = e.target;
        while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
            obj = obj.parentNode;
            if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
                break;
        }
        if (obj.nodeName == 'A' && obj.href != '') {
            objActive = obj;
            act = 1;
            clrOrg = obj.style.color;
            TimerID = setInterval("ChangeColor()", 100);
        }
    }
}
function Mozilla_stopRainbowAnchor(e) {
    if (act) {
        if (objActive.nodeName == 'A') {
            objActive.style.color = clrOrg;
            clearInterval(TimerID);
            act = 0;
        }
    }
}
function ChangeColor() {
    objActive.style.color = makeColor();
}
function makeColor() { 
    // Don't you think Color Gamut to look like Rainbow?
    // HSVtoRGB 
    if (elmS == 0) {
        elmR = elmV; elmG = elmV; elmB = elmV;
    }
    else {
        t1 = elmV;
        t2 = (255 - elmS) * elmV / 255;
        t3 = elmH % 60;
        t3 = (t1 - t2) * t3 / 60;
        if (elmH < 60) {
            elmR = t1; elmB = t2; elmG = t2 + t3;
        }
        else if (elmH < 120) {
            elmG = t1; elmB = t2; elmR = t1 - t3;
        }
        else if (elmH < 180) {
            elmG = t1; elmR = t2; elmB = t2 + t3;
        }
        else if (elmH < 240) {
            elmB = t1; elmR = t2; elmG = t1 - t3;
        }
        else if (elmH < 300) {
            elmB = t1; elmG = t2; elmR = t2 + t3;
        }
        else if (elmH < 360) {
            elmR = t1; elmG = t2; elmB = t1 - t3;
        }
        else {
            elmR = 0; elmG = 0; elmB = 0;
        }
    }
    elmR = Math.floor(elmR).toString(16);
    elmG = Math.floor(elmG).toString(16);
    elmB = Math.floor(elmB).toString(16);
    if (elmR.length == 1) elmR = "0" + elmR;
    if (elmG.length == 1) elmG = "0" + elmG;
    if (elmB.length == 1) elmB = "0" + elmB
    elmH = elmH + rate;
    if (elmH >= 360)
        elmH = 0;
    return '#' + elmR + elmG + elmB;
}
//]]>
</script>

Answer 1

使用 CSS 的悬停选择器并向 div 添加一个类，就像这样......

<style>
    .colourful_link a:hover{
       color:green;
    }
</style>

<div class="colourful_link">
<a href="#">I go Nowhere!!</a>
</div>

<a href="#">I am not colourful!!</a>

编辑

好吧，是的，我错了你的问题。所以你可以使用 jQuery 来实现它。为所有你想要彩虹的链接添加一个类，并添加 mouseenter 和 mouseleave 事件处理程序。可能此文档会有所帮助: jquery.mouseover()