如何在沒有javascript而沒有jquery的情況下將id添加到沒有id的元素

Question

我有以下HTML代碼：

    <div class="someclass">
        <ul>
           <li><a title="someFile" href="somefolder/somefile.pdf">File Name</a>
           <li><a title="someFile2" href="somefolder/somefile2.pdf">File 2</a>
        </ul>
    </div>

我希望鏈接成為：

    <li><a title="someFile" href="somefolder/somefile.pdf" target="_blank">File Name</a>
    <li><a title="someFile2" href="somefolder/somefile2.pdf" target="_blank">File 2</a>

這可以用純javascript完成，沒有jquery或其他庫嗎？

我使用getElementByID使用jquery做了類似的事情，但是這里的元素沒有id，所有它都是類“someclass”，由於各種原因，我不想更改html。 我想要做的只是在頁面底部插入小javascript，將在使用以下文件加載文檔時執行：

window.onload="myFunction()";

這項任務能否以我想要的方式完成？

Answer 1

你只需要寫

var matches = document.querySelectorAll('a');
for (var i = 0; i < matches.length; i++) {
    matches[i].setAttribute('target', '_blank');
}

小提琴

Answer 2

var links = document.querySelector('.someclass').getElementsByTagName('a');

Array.prototype.forEach.call(links, function(el) {
    // set attribute
    el.setAttribute('target','_blank');
});

有關工作示例，請參見http://jsfiddle.net/sjmcpherso/krktmghd/

這個答案是IE9 +所以是的，你真的不需要jQuery

Answer 3

嘗試這個：

var pageLinks = document.getElementsByTagName("a");
for(var x in pageLinks) {
    pageLinks[x].target = "_blank";
}

Answer 4

嘗試這個：

var prnt = document.querySelector('.someclass ul').childNodes;
for(var i=0;i<prnt.length;i++){
    if(prnt[i].nodeType == 1){
       prnt[i].firstChild.setAttribute('target','_blank');        
    }
}

輸出：

<div class="someclass">
    <ul>
       <li><a title="someFile" href="somefolder/somefile.pdf" target="_blank">File Name</a>
       <li><a title="someFile2" href="somefolder/somefile2.pdf" target="_blank">File 2</a>
    </ul>
</div>

工作演示

Answer 5

看看這里。

http://www.w3schools.com/js/js_htmldom_nodes.asp

如上所述，這是你只能用Javascript做的事情

var para = document.createElement("p"); //create p element
var node = document.createTextNode("This is new."); //create text element
para.appendChild(node); //append text to p

var element = document.getElementById("div1");
element.appendChild(para); //append p to somewhere in your page