如何动态注入JavaScript函数？
如何动态注入JavaScript函数？
提问于 2011-04-07 07:37:01
我在工作中坚持使用一个界面糟糕的产品，并试图通过Chrome中的UserScripts让它变得令人愉快。为此，我尝试通过UserScripts机制将JavaScript函数注入到页面中：
// 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 + " <input type='button' name='btnSearch' value='Go' onClick='javascript:gotoIncident()' >";如您所见，我注入了一个按钮和一个函数(gotoIncident)，当用户单击该按钮时将触发该函数。
按钮确实出现在屏幕上，但当我单击它时，javascript调试器告诉我没有定义gotoIncident。
我遗漏了什么？
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-05-13 02:40:50
作为参考，我用以下方式解决了这个问题：
myDiv.innerHTML = myDiv.innerHTML + " <input type='text' id='txtSearch' name='txtSearch' style='position:absolute;top:8px;left:800px;width:50px' >";
myDiv.innerHTML = myDiv.innerHTML + " <input type='button' name='btnSearch' value='Go' onclick='fn()' style='position:absolute;top:8px;left:860px;width:35px'>";
addScript("function fn() {var obj = document.getElementById('txtSearch'); "
+ "if (obj != null) { "
+ " var incidentId = document.getElementById('txtSearch').value; "
+ " var currentURL = location.href; "
+ " var splitResult = currentURL.split('/'); "
+ " var projectId = splitResult[4]; "
+ " location.href = 'http://site/SpiraTeam/' + projectId + '/Incident/' + incidentId + '.aspx'; "
+ " } }"
, "fn");}
Stack Overflow用户
发布于 2011-04-07 07:46:45
在<head>中注入一个包含自调用函数的<script>标签：
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);Stack Overflow用户
发布于 2011-04-07 07:43:43
您需要在全局作用域中定义函数(将其放在小节中)才能在需要使用它的地方使用它。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/5574231
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号