我想知道如何找出哪个 Javascript 文件正在更改我页面上输入的文本。
例如,我有一个带有文本输入的页面和 5 个包含的 javascript 文件,但我不知道哪个正在更改文本输入的值。
我试过使用更改事件,但是当文本被另一个脚本更改时,它不会触发。
1.js文件:
<script>
$(".MySection").children().children().eq(3).val("Text Changed!")
</script>
2.js文件:
<script>
$(".MySection").children().children().eq(3).val("Text Changed!")
</script>
最佳答案
简短的回答是你不能。您要的是 javascript 堆栈跟踪。
堆栈跟踪很容易强制/生成如下:
$("#myText").change(function(){
var e = new Error('dummy');
var stack = e.stack.replace(/^[^\(]+?[\n$]/gm, '')
.replace(/^\s+at\s+/gm, '')
.replace(/^Object.<anonymous>\s*\(/gm, '{anonymous}()@')
.split('\n');
console.log(stack);
});
});
可以在 Chrome 中使用浏览器开发工具 Ctrl+Shift+I 读取 console.log。
所以这一切都很好,但正如您正确指出的那样,当输入的值是动态设置时,更改事件不会触发,即通过代码,因此您没有地方可以放置堆栈跟踪代码以便获取堆栈跟踪,使您可以查看进行更改的代码/代码文件。
$(".MySection").children().children().eq(3).val("Text Changed!")
没有办法解决这个问题,因为您根本无法拦截事件。即使您注册/绑定(bind)到 propertychanged、change、input、keydown、paste、DOMSubtreeModified 事件,它也不会工作,因为这些事件都不会触发以响应输入文本值的动态更新。
$("#myText").bind("propertychanged, change, input, keydown, paste, DOMSubtreeModified", function(event){
// call stack trace here, except these bindings WONT be fired whenever the val is set dynamically
});
您可能会开始追踪 DOM 4 Mutation Observers :
MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
var observer = new MutationObserver(function(mutations, observer) {
// fired when a mutation occurs
console.log(mutations);
// ...
});
var n = $("#myText").get(0);
// define what element should be observed by the observer
// and what types of mutations trigger the callback
observer.observe(n, {
subtree: true,
attributes: true,
childList: true,
characterData: true,
attributeOldValue: true,
characterDataOldValue: true
});
但它们不会帮助您,因为它们不观察单个控件属性,而只是观察与 DOM 相关的更改。即添加和删除节点等。它们不允许您在输入中注册文本更改事件。
我只能说,如果您有一个您无法控制的网页,即您被排除在外,那么我认为您应该认真地重新考虑设计。
关于javascript - 当脚本代码更改文本时返回输入的 javascript 堆栈跟踪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25421982/