[英]Chrome extension: How to modify elements created from an Ajax request in a webpage?
我正在尝试为此页面http://jisho.org/kanji/radicals/制作Chrome扩展程序,我遇到了问题。
扩展名应该修改#found_kanji
div
包含“kanji”的元素,但是当页面加载时这些元素不存在,而是在用户点击“激进”(汉字的一部分)后触发它们从网站数据库加载汉字的Ajax查询。
我该如何修改这些元素?
从我查看的内容来看,DOM操作事件现在已被弃用,因此我无法监视元素的创建时间。 我可以尝试使用webRequests API替换本地版本的网站javascript,我认为它会很难看但它可以工作,但后来我意识到我无法从网页脚本到内容脚本或扩展程序进行通信本身。 有人有想法吗?
您可以使用MutationObserver
监听特定div中的DOM更改,并在将新元素添加到div时执行修改:
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if(mutation.addedNodes.length){
var addedNodes = Array.prototype.slice.call(mutation.addedNodes);
addedNodes.forEach(function(node){
if(node.className == 'something'){
// do stuff
}
});
}
});
});
observer.observe(document.getElementById('found_kanji'), { subtree: true, childList: true, characterData: true });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.