gpt4 book ai didi

javascript - 如何动态注入(inject) JavaScript 函数?

转载 作者:行者123 更新时间:2023-11-29 18:33:20 27 4
gpt4 key购买 nike

我在工作中一直在使用一个用户界面糟糕的产品,并试图通过 Chrome 中的 UserScripts 让它变得可口。为此,我试图通过 UserScripts 机制将 JavaScript 函数注入(inject)页面:

// find the div
var dropDown = document.getElementById("tstGlobalNavigation_ddlChooseProject");

// inject function
dropDown.innerHTML = dropDown.innerHTML + "<script>function gotoIncident(){alert('111')}</script>";

// inject a button
dropDown.innerHTML = dropDown.innerHTML + "&nbsp;&nbsp;&nbsp;<input type='button' name='btnSearch' value='Go' onClick='javascript:gotoIncident()' >";

如您所见,我正在注入(inject)一个按钮和一个函数 (gotoIncident),当用户单击该按钮时应触发该函数。

按钮确实出现在屏幕上,但当我单击它时,javascript 调试器告诉我 gotoIncident 未定义。

我错过了什么?

最佳答案

注入(inject) <script>标记到 <head>其中包含一个自调用函数:

var head = document.getElementsByTagName('head')[0],
script = document.createElement('script');

script.src = 'path/to/script.js';
head.appendChild(script);

引用的脚本看起来像这样:

(function(){
// do your stuff here
})();

编辑

如何将其作为内联脚本:

function fn() {
alert('hello JS');
}

var head = ...,
script = ...;

// FF doesn't support innerText
script[script.innerText ? 'innerText' : 'textContent'] = '(' + fn + ')()';
head.appendChild(script);

Demo

关于javascript - 如何动态注入(inject) JavaScript 函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5574231/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com