我想在将一些div或输入添加到html时执行一个函数.这可能吗？
例如,添加文本输入,然后应该调用该函数.
我需要一种有效的机制来检测DOM的变化.最好是跨浏览器,但如果有任何有效的方法不是跨浏览器,我可以使用故障安全的跨浏览器方法实现这些.
特别是,我需要检测会影响页面上文本的更改,因此需要任何新的,删除或修改的元素或对内部文本(innerHTML)的更改.
我无法控制正在进行的更改(它们可能是由于第三方javascript包含等),因此无法从这个角度进行处理 - 我需要以某种方式"监视"更改.
目前我实施了一个"quick'n'dirty"方法,body.innerHTML.length每隔一段时间检查一次.这当然不会检测导致返回相同长度的变化,但在这种情况下"足够好" - 这种情况发生的可能性非常小,并且在此项目中,未能检测到更改将不会导致丢失的数据.
问题body.innerHTML.length是它很贵.在快速浏览器上可能需要1到5毫秒,这可能会让事情陷入困境 - 我也在处理大量的iframe,而且这些都会增加.我很确定这样做的代价是昂贵的,因为innerHTML文本不是由浏览器静态存储的,并且每次读取时都需要从DOM计算.
我正在寻找的答案类型是从"精确"(例如事件)到"足够好"的任何东西 - 或许像innerHTML.length方法一样"quick'n'dirty",但执行速度更快.
编辑:我还应该指出,虽然检测已经修改过的精确元素会"很好",但这并不是绝对必要的 - 只要有任何改变这一事实就足够了.希望这能够扩大人们的反应.我将调查突变事件,但我仍然需要IE支持的后备,所以任何笨拙的,创造性的,非常方形的想法将是非常受欢迎的.
关于将未来的操作绑定到不存在的元素上存在很多问题,这些元素最终都以live/delegate回答.我想知道如何运行任意回调(例如,添加类或触发插件)到匹配选择器的所有现有元素以及与尚未创建的相同选择器匹配的所有未来元素.
似乎livequery插件的主要功能使其成为核心,但另一部分,附加任意回调在某种程度上丢失了.
另一个常见的答案是事件委派,但是如果一个人无法访问创建元素以触发事件的所有供应商代码,该怎么办？
这是一些现实世界的代码:
// with livequery
$('input[type=text], input[type=password], textarea, .basic_form .block select, .order_form .form_item select, .order_form .form_item input')
.livequery(function(){
$(this)
.focus(function(){
$(this).addClass('active');
})
.blur(function(){
$(this).removeClass('active');
})
.addClass('text');
});
// with live
$('input[type=text], input[type=password], textarea, .basic_form .block select, .order_form .form_item select, .order_form .form_item input')
.live('focus', function(){
$(this).addClass('active');
})
.live('blur', function(){
$(this).removeClass('active');
});
// now how to add the class to future …已知DOMNodeInserted使动态页面变慢,MDN甚至建议不要完全使用它,但不提供任何替代方案.
我对插入的元素不感兴趣,我只需要知道一些脚本何时修改DOM.是否有更好的替代突变事件监听器(可能是nsiTimer中的getElementsByTagName)？
JQuery中是否有任何DOM突变事件或者是跨浏览器的vanilla Javascript？
为了澄清,我说我的页面上有一个脚本,它将div插入到正文中.我无法访问该脚本,我不知道何时插入了div.我想知道是否有一个DOM突变事件,我可以添加一个监听器,以了解何时插入了一个元素.我知道我可以使用计时器来定期检查插入,但是,我真的不喜欢这会带来的开销.
我需要利用这个DOM事件.IE有onpropertychange,这也是我需要它做的事情.但是,Webkit似乎不支持此事件.有没有我可以使用的替代方案？
由于w3c将DOM变异标记为已弃用(请参阅http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents),是否有(快速)替代方法来检测属性修改在DOM？
除了使用计时器来计算一段时间内的元素数量并寻找变化之外,我想不出更好的方法来模拟这个事件.
是否有某种专有的IE版DOMNodeInserted？谢谢.
我试图弄清楚是否有任何方式来监听像属性focus或change具有contenteditable属性的HTML元素的事件.
我有这个HTML标记:
<p id="test" contenteditable >Hello World</p>
我试过这些没有任何成功(JSBin):
var test = document.querySelector('#test');
test.addEventListener('change', function(){
alert('content edited');
}, false);
test.addEventListener('DOMCharacterDataModified', function(){
alert('content edited');
}, false);
test.addEventListener('focus', function(){
alert('content edited');
}, false);
我不想听键盘或鼠标事件.我没有找到任何明确的文件W3C和MDN有关contenteditable.
是否可以在内容可编辑的HTML元素上收听change和/ focus或其他事件？
我在我的页面上使用了以下jQuery代码,并且chrome上的一切正常.但是当我在firefox中打开相应的页面时,我得到了无响应的脚本错误.
我知道根据DOM3规范,变异事件已被弃用.但是,如果有人能帮助我在这里,我将被迫.
jQuery('#term').on("DOMSubtreeModified",function(){
$("#term > .click-slide").click(function(){
$(this).siblings().slideToggle();
});
});
各自的HTML是:
<div class="btn-slide" id="term">
<div class="click-slide">
<button>Search Terms </button>
</div>
<div class="btn-box">
<label><span>Novena</span></label>
</div>
</div>