jquery监听div等元素的内容变化

方法一:change事件

change事件,在元素的值发生改变时触发,适用于文本域、textarea、select 。 或调用change()方法时可以监听。所以,我们可以模拟change为非表单元素监听change()事件。



	
		
		change事件
		
	
	
		

以上demo中,点击按钮,为div中动态添加内容,添加内容后,手动调用change()方法,为div模拟出change事件。

注: 1.以上demo中是追加的内容,所以没有判断div的内容是否发生变化,如果在其他场景下,可以自己判断div内容是否发生了变化

        2 .只要兼容jquery的浏览器都可以兼容此方法。


方法二:DOMNodeInserted事件

经测试,这个DOMNodeInserted事件可以监听到非表单元素的内容的变化,只有在插入节点时有效,相反DOMNodeRemoved事件,只有在移除节点时有效。DOMNodeInserted事件是js提供的一个dom2级事件(具体什么意思,我还没有弄懂,弄懂后回来补充,此处省略1000字。。。),总之,是可以监听到的。



	
		
		change事件
		
	
	
		

注: 此方法存在ie8及以下浏览器中失效


方法三:定时任务

可以通过定时任务来监听非表单元素的内容变化,如果以上两种方法均不适用的情况下,可以尝试此种方法




	
		
		change事件
		
	
	
		


你可能感兴趣的:(JavaScript技巧,JavaScript,jquery)