詳解Html a標簽中href和onclick用法、區別、優先級別

如果不設置 href屬性在IE6下面會不響應hover。雙擊后會選中標簽的父容器而非這個一a標簽（IE下都存在這一問題）。

代碼如下 

<a href="javascirpt:fn(this)"> <a onclick="fn(this)">

假定我們有個fn方法，需要取到這個元素，第一個方法傳入的this是空值。

所以，比較推薦的寫法是

代碼如下

<a href="javascript:void(0)" onclick="fn(this)">

下面代碼則執行了subgo()函數，

代碼如下

<a href="javascript:void(0)" onclick="subgo()">點我</a>

在這里，javascript:void(0),沒啟實質上的作用，它僅僅是一個死鏈接，執行的函數是subgo()。

代碼如下

<a  onclick="subgo()">點我</a>與<a href="javascript:void(0)" onclick="subgo()">點我</a>區別。

實際上 #包含了一個位置信息默認的錨是#top 也就是網頁的上端 ，而javascript:void(0) 僅僅表示一個死鏈接，沒有任何信息。所以調用腳本的時候最好用void(0)

href一般是指向一個URL地址，也可以調用javascript ,如href="javascript:xxx();",文檔中推薦這樣寫：

代碼如下

<a href="https://www.jb51.net/zhongxing/U880/ javascript:void(0)" onclick="xxx();">xx</a>

但是這種方法在復雜環境有時會產生奇怪的問題，盡量不要用javascript:協議做為A的href屬性，這樣不僅會導致不必要的觸發window.onbeforeunload事件，在IE里面更會使gif動畫圖片停止播放。

我們知道鏈接的 onclick 事件被先執行，其次是 href 屬性下的動作（頁面跳轉，或 javascript 偽鏈接），如果不想執行href 屬性下的動作執行，onclick 需要要返回 false ，一般是這樣寫onclick="xxx();return false;".

TabPane的JS源碼，由于onclick沒有返回FALSE，當IFRMAE中關閉TABPANE時會導致href執行，頁面顯示有問題。解決辦法就是將下面代碼復制到使用TAB的JSP中。

Html A標簽中 href 和 onclick 同時使用的問題 優先級別

1 順序

ie 6 : href 先觸發 onclick 后觸發

其他瀏覽器 先觸發onlick 后觸發 href

2 href="javascript: xxx()"

不能傳入this作為參數

onclick可以

代碼如下

<a href="javascript:alert('href event');" onclick="clickevent(this);">

3 優先觸發的方法如果返回 false 導致后一個事件不被觸發

比如

代碼如下

<a href="javascript:alert('href event');" onclick="clickevent(this); return false;">

4

<a href="#"> 會導致頁面定位到書簽位置，

5

由于 1和 4 的原因

在ie6 下 同時有 <a href="#" 和 onclick的時候 由于頁面先因為href重新載入了一次，導致 onclick事件被瀏覽器丟棄。

6 總結：

1) 在不需要傳遞this作為方法的參數時候，推薦

只使用href="JavaScript: "

2) 如果需要使用this參數，推薦

代碼如下

<a href="javascript:void(0);" onclick="doSomthing(this)" > 

如下面一個列子。

我們需要A在第一次和第二次點擊的時候 訪問 href 第3次以后的就訪問另一個地址

代碼如下

var href=0
function clicka(obj)
{
 if (href==2)
 {
 obj.;
 }else
 {
 href++;
 }
 return true;
}
 <a  target=_blank id="showa" onclick="clicka(this)"> 開屏高速下載 </a> 

在a標簽的href與onclick中使用javascript的區別

鏈接的 onclick 事件被先執行，其次是 href 屬性下的動作（頁面跳轉，或 javascript 偽鏈接）；

假設鏈接中同時存在 href 與 onclick，如果想讓 href 屬性下的動作不執行，onclick 必須得到一個 false 的返回值。不信，你可以將 goGoogle 函數中的 return false 注釋掉；

如果頁面過長有滾動條，且希望通過鏈接的 onclick 事件執行操作。應將它的 href 屬性設為 javascript:void(0);，而不要是 #，這可以防止不必要的頁面跳動；

如果在鏈接的 href 屬性中調用一個有返回值的函數，當前頁面的內容將被此函數的返回值代替；

在按住Shift鍵的情況下會有所區別。

今天我遇到的問題，在IE6.0里以href的形式訪問不到parentNode。

盡量不要用javascript:協議做為A的href屬性，這樣不僅會導致不必要的觸發window.onbeforeunload事件，在IE里面更會使gif動畫圖片停止播放。

就這些，花了不少時間在這上面。

[緣由]

用CheckBoxList控件時想實現在每個checkbox后再加鏈接的功能，點鏈接實現一些功能之外，還要把checkbox選中。

代碼如下

<input type="checkbox" name="chk" id="chk">
<label for="chk">選中它<a onclick="this.parentNode.click();"  >[label中的鏈接]</a></label>

最后用parentNode來實現的。

以上就是本文的全部內容，希望本文的內容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持億速云！