將<a>標簽的</a> href更改<a>為</a> <a><input></a> <a>使用JavaScript標記onClick</a>

Question

是否有可能做到這一點：

<a class="a-link" href="/targetlink" target="_blank" rel="nofollow">Download</a>
<a class="a-link" href="/targetlink" target="_blank" rel="nofollow">Alternative</a>

頁面加載完成后使用JavaScript自動替換

<input type="button" class="a-link" onClick="parent.open('/targetlink')" formtarget="_blank">Download</input>
<input type="button" class="a-link" onClick="parent.open('/targetlink')" formtarget="_blank">Alternative</input>

Answer 1

您可以通過刪除現有標簽並創建另一個具有相同屬性的標簽來做到這一點。

或者，您可以簡單地使用replaceWith()進行此replaceWith() 。

$('#target').replaceWith('<newTag>' + $('target').html() +'</newTag>')

Answer 2

加載文檔后，遍歷目標，為找到的每個對象創建一個新元素，並將初始元素替換為新元素：

window.addEventListener('load', function() {
    document.getElementsByClassName('a-link').map(function(elem){
        var newElem = document.createElement('input');
        newElem.type = 'button';
        newElem.classList = item.classList;
        newElem.target    = item.target;
        newElem.addEventListener('click', function(){ /* define click event here */ })
    });

    elem.parentElement.replaceChild(newElem, elem);
});

可以使它更可靠，但是對於您的問題范圍，它應該提供適當的答案。