我正在尝试修复并发布我的代码.我最初使用DOMNodeRemoved和DOMNodeInserted来关注我正在处理的页面中的元素.他们运作良好,但在IE中没有运作.所以我开始尝试使用MutationObserver.
这是我在onPageInit上调用的代码(回调写入控制台但我禁用了它,因为IE不再支持控制台):
var callback = function(allmutations){ allmutations.map( function(mr){ var mt = 'Mutation type: ' + mr.type; // log the type of mutation mt += 'Mutation target: ' + mr.target; // log the node affected. //console.log( mt ); }) } mo = new MutationObserver(callback), options = { // required, and observes additions or deletion of child nodes. 'childList': true, // observes the addition or deletion of "grandchild" nodes. 'subtree': true } alert('its alive'); mo.observe(document.body, options);
它在chrome中运行良好,但由于某种原因在IE中没有变化.我在页面加载过程中收到一个消息框,上面写着:
An unexpected error occurred in a script running on this page. onPageInit(pageInit) scriptname JS_EXCEPTION TypeError 'MutationObserver' is undefined
难道我做错了什么?附加信息:Page是一个netsuite页面,运行jQuery 1.7.2(如果重要的话)
如果您需要在IE10 +(以及其他尚不支持的浏览器)中检测DOM插入,MutationObserver
您可以使用基于侦听animationstart
事件的技巧来获取CSS动画,该动画可以为不影响节点外观的属性设置动画.
这项技术是由Daniel Buchner发现的,你可以看到它由David Walsh在这篇文章中描述过
使其工作所需的代码将是这样的:
@keyframes animationName{ from { outline: 1px solid transparent } to { outline: 0px solid transparent } } * { animation-duration: 0.001s; animation-name: animationName; }
和
document.addEventListener('animationstart', insertionHandler, false);
这个技巧跨浏览器工作所需的设置非常复杂,包括所有前缀和事件监听器名称.将为每个新节点调用处理程序,并且选择要设置为动画的属性很难.
这就是为什么我将它包装在库中以使其易于使用:https: //github.com/naugtur/insertionQuery
这是一个简短的用法示例:
insertionQ('selector').every(function(element){ //callback on every new element });
该方法是在IE11中添加的,因此如果浏览器在兼容模式下运行IE11以外的任何其他方法,它将无法使用.
http://msdn.microsoft.com/en-us/library/ie/dn265034(v=vs.85).aspx