將target =“blank”添加到使用javascript的鏈接

Question

我正在嘗試將target="_blank"添加到頁面上的鏈接，具體取決於復選框的點擊。

在javascript方面，我有：

 function newTab(v) {
      if(v.tab.checked == true) { 
        document.getElementsByTagName('a').setAttribute('target', '_blank');
      } else {
        document.getElementsByTagName('a').setAttribute('target', '_self');
      }
  } //end function

在HTML方面，我有：

<form>
    <input type="checkbox" name="tab" onclick="newTab(this.form)" />
    <label>Open Links In New Tab?</label>
</form>

<a href="//mail.google.com">Gmail</a>

當然，它並不像我想象的那么簡單，所以它不起作用。

該頁面包含十幾個鏈接，因此我需要復選框以應用於頁面上的所有鏈接 - 為什么我使用了getElementsByTagName() 。 任何幫助贊賞！

編輯：

有效的代碼如下：

  function newTab(f) {
    var els = document.getElementsByTagName('a'); //read anchor elements into variable
    if(f.tab.checked == true) { //If the box is checked.
      for (var i in els) {
        els[i].setAttribute('target', '_blank'); //Add 'target="blank"' to the HTML
      } 
    } else { // not checked...
      for (var i in els) {
        els[i].setAttribute('target', '_self'); //Add 'target="self" to HTML
      }
    }
  } //end function. 

Answer 1

getElementsByTagName()返回一個節點集。 您需要迭代它並依次將更改應用於每個。 你現在擁有的更像是jQuery語法，它可以在內部為你處理。

這將出現在控制台中。 有了JS的問題，在想知道什么是錯的之前，請務必檢查控制台。

var els = document.getElementsByTagName('p');
for (var i=0, len = els.length; i<len; i++)
    els[i].setAttribute('name', 'value');

此外，復選框使用更改，而不是單擊事件，因為有人可能通過鍵盤切換它們，而不是鼠標。 最后，您應該考慮集中處理事件，而不是HTML中指定的內聯DOM-zero事件。 造成這種情況的眾多原因超出了本問題的范圍。