如何禁用鏈接在javascript

Question

這實際上是一個2部分的問題。

1）我在此刻通過我的鏈接循環的麻煩和使用javascript禁用它。我需要抓住從所謂的「底部」一個div ID鏈接和任何聯繫「NHL」在它需要被禁用或只是將無法正常工作，但是你想字呢。到目前爲止，我有：外部js文件。

onload = function() { 
    var links = document.getElementById("bottom").getElementsByTagName("a"); 

    for(i = 0; i < links.length; i++) { 
     if (links[i].indexOf("nhl") >= 0) { 
      links[i].onclick = function() { 
       return false; 
      } 
     } 
    } 
} 

HTML文件：

<div id="bottom" class="change"> 
<a href="http://www.nhl.com/">www.nhl.com</a> 
<a href="https://www.youtube.com/">www.youtube.com</a> 
<a href="http://www.w3schools.com/">www.w3schools.com</a> 
</div> 

2）此刻我的js文件包含像情侶功能：

function changeColorOnMouseIn() { 
    this.style.color = "red"; 
} 

function changeColourOnMouseOut() { 
    this.style.color = "black"; 
} 

onload = function() { 
    var divClasses = querySelectorAll(".change p"); 

    for(i = 0; i < divClasses.length; i++) { 
     divClasses[i].onmouseover = changeColorOnMouseIn; 
     divClasses[i].onmouseout = changeColorOnMouseOut; 
    } 
} 

我的問題是我應該繼續做這樣或那樣代之以做這樣的事情：

onload = function() { 
    var divClasses = document.querySelectorAll(".change p"); 

    for(i = 0; i < divClasses.length; i++) { 
     divClasses[i].onmouseover = function() { 
      this.style.color = "red"; 
     } 
    } 
} 

或者我應該只是做，做所有以for循環，只是稱之爲「myFunctionName（）」在onload功能的功能？有什麼區別？在什麼情況下你會做另一個呢？

謝謝！

Answer 1

對於第一部分我發現在循環的一個小錯誤，你需要寫鏈接[I] .href.indexOf（ 「NHL」）

onload = function() { 
var links = document.getElementById("bottom").getElementsByTagName("a"); 

    for(i = 0; i < links.length; i++) { 
     if(links[i].href.indexOf("nhl") >= 0) {// CHANGE 
      links[i].onclick = function() { 
       return false; 
       } 
      } 
    } 
} 

對於第二部分你可以很容易地通過CSS

.change p { 
    color: black; 
} 
.change p:hover{ 
    color: red; 
} 

做，如果你仍然想這樣做在JavaScript那麼這種方式較好

function changeColorOnMouseIn() { 
    this.style.color = "red"; 
} 

function changeColourOnMouseOut() { 
    this.style.color = "black"; 
} 

onload = function() { 
    var divClasses = querySelectorAll(".change p"); 

    for(i = 0; i < divClasses.length; i++) { 
     divClasses[i].onmouseover = changeColorOnMouseIn; 
     divClasses[i].onmouseout = changeColorOnMouseOut; 
    } 
} 

這裏之所以說這種做法是更好的辦法是，因爲下面的代碼將創建一個匿名函數的n個，所以如果循環會用於10個項目將有10匿名函數，全在上面的方法將有單函數聲明。

divClasses[i].onmouseover = function() { 
    this.style.color = "red"; 
}