一些很少用到的js

oninput,onpropertychange,onchange的用法

onchange触发事件必须满足两个条件：

a）当前对象属性改变，并且是由键盘或鼠标事件激发的（脚本触发无效）

b）当前对象失去焦点(onblur)；

onpropertychange的话，只要当前对象属性发生改变，都会触发事件，但是它是IE专属的；

oninput是onpropertychange的非IE浏览器版本，支持firefox和opera等浏览器，但有一点不同，它绑定于对象时，并非该对象所有属性改变都能触发事件，它只在对象value值发生改变时奏效。

在textarea中，如果想捕获用户的键盘输入，用onkeyup检查事件就可以了，但是onkeyup并不支持复制和粘贴，因此需要动态监测textarea中值的变化，

这就需要onpropertychange（用在IE浏览器）和oninput（非IE浏览器）结合在一起使用了。

在代码实现时，发现在响应用户onclick了textarea时，如果使用obj.className=”XX”;来改变textarea输入框中字体的样式，

会导致在ie下会有在输入第一个字符的时候onpropertychange不会触发的bug，因此需要这样设置：obj.style.color=”#000”;

可以采用compositionstart、compositionend来捕获IME（input method editor）的启动和关闭事件来监听中文输入法的开启和关闭

一、监视DOM变动的HTML5API 只在所有的DOM变动结束后才触发 但是不能监听value值的变化

1.用法:

实例化一个 var observer = new MutationObserver(callback);

var article = document.querySelector(‘article’);

var options = {

‘childList’: true,

‘arrtibutes’: true

};

observer.observe(article, options);

options是需要监视的

childList：子元素的变动

attributes：属性的变动

characterData：节点内容或节点文本的变动

subtree：所有下属节点（包括子节点和子节点的子节点）的变动 需要注意的是，不能单独观察subtree变动，必须同时指定childList、attributes和characterData中的一种或多种。

attributeOldValue：值为true或者为false。如果为true，则表示需要记录变动前的属性值。

characterDataOldValue：值为true或者为false。如果为true，则表示需要记录变动前的数据值。

attributesFilter：值为一个数组，表示需要观察的特定属性（比如[‘class’, ‘str’]）。

2.disconnect方法和takeRecord方法

disconnect方法用来停止观察。发生相应变动时，不再调用回调函数。

observer.disconnect();

takeRecord方法用来清除变动记录，即不再处理未处理的变动。

observer.takeRecord

3.MutationRecord对象

DOM对象每次发生变化，就会生成一条变动记录。这个变动记录对应一个MutationRecord对象，该对象包含了与变动相关的所有信息。Mutation Observer进行处理的一个个变动对象所组成的数组。

MutationRecord对象包含了DOM的相关信息，有如下属性：————–作为callback的参数传入

type:观察的变动类型（attribute、characterData或者childList）。

target:发生变动的DOM对象。

addedNodes:新增的DOM对象。

removeNodes:删除的DOM对象。

previousSibling:前一个同级的DOM对象，如果没有则返回null。

nextSibling:下一个同级的DOM对象，如果没有就返回null。

attributeName:发生变动的属性。如果设置了attributeFilter，则只返回预先指定的属性。

oldValue:变动前的值。这个属性只对attribute和characterData变动有效，如果发生childList变动，则返回null。

oncopy onpaste 监听复制和粘贴事件

compositionstart、compositionend 监听输入法的开启和结束

oncontextmenu 鼠标右键弹起时触发事件