使用 JS 删除 onclick 功能答案

【问题标题】：Removing onclick funtion using JS使用 JS 删除 onclick 功能
【发布时间】：2021-04-27 21:24:40
【问题描述】：

我正在使用具有导航栏模板的主机，我可以设置它的样式但不能编辑其中的内容。搜索功能会弹出一个搜索框，但是我在实际页面 /search 上开发了一个高级搜索。有没有办法从这个链接中删除 onclick 和 target？我无法访问实际的 HTML 来删除它，因此我必须有一些东西覆盖它。

 <a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;" target="_blank">Search</a>

【问题讨论】：

无法访问 HTML 是什么意思？你能用 Javascript 做吗？您是在尝试破解网页吗？
@Rojo，不，我不是要破解网页。这是一个菜单是模板的网络主机，所以我可以访问的代码是 '
{GENERATED_NAV_BAR}

' 显然，我无法访问从搜索功能中删除 onclick 的功能。

标签： javascript html css

【解决方案1】：

您可以使用 removeAttribute 函数来删除这些属性。下面是一个工作示例。

window.onload=function(){
    var anc=document.getElementsByClassName("mainmenu");
    anc[0].removeAttribute("target");
    anc[0].removeAttribute("onclick");
}

&lt;a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;" target="_blank"&gt;Search&lt;/a&gt;

【讨论】：

var 和 getElementsByClassName ?我们生活在 2021 年的男人
@vdegenne 这个解决方案 hv 问题吗？
我没有说解决方案有问题。只是使用了旧语法。

【解决方案2】：

将 null 分配给 IDL 属性将清除内联处理程序：

const a = document.querySelector('.mainmenu');
a.onclick = null;
a.removeAttribute('target');

&lt;a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;" target="_blank"&gt;Search&lt;/a&gt;

【讨论】：

等等，你确定可以设置一个对象的属性，如果它是 const 的？
当然。 const 所做的只是防止 变量名 被重新分配给其他东西。它不会阻止对象发生变异。
document.querySelector('.mainmenu') 是更好的做法。用宽选择器选择东西通常是一个坏习惯。
@vdegenne，我尝试了这段代码，它仍然允许链接生成弹出窗口而不是指向页面，有什么想法吗？
@mikehunni 我仔细检查了一个独立文件，_target 看起来已成功删除；单击独立文件中的链接会导致整个页面重定向到/search

【解决方案3】：

删除target 和onclick 属性并将href 属性值替换为javascript:void(0)。您可以使用以下代码。

var a = document.getElementsByClassName('mainmenu')[0];
a.removeAttribute('onclick');
a.removeAttribute('target');
a.setAttribute('href', 'javascript:void(0)');

&lt;a class="mainmenu" href="/search" onclick="showhide(document.getElementById('search_menu')); return false;" target="_blank"&gt;Search&lt;/a&gt;

【讨论】：