JS_事件分类

## 事件对象
    跟事件相关的一系列数据
    e:将来事件发生后，系统给我们传递的代表事件对象，在ie中window.event
    兼容写法：注意变量作用域问题
        var e = e || window.event
        或者：var e = e || event;
    ex: var x = x;会出现undefined，即使是在全局作用域存在！
    target:触发事件的对象; //this:返回的是绑定事件的元素 == currentTarget
    srcElement:ie6~8使用，非标准
    type:事件类型，不带"on"
    cancelBubble:阻止冒泡非标准【赋值为 true 、 false】
    returnValue:标准属性，阻止冒泡
    e.preventDefault()    阻止默认事件
        ex:超链接，单击跳转。
        e.returnValue = false; //ie678支持阻止默认
        return false; //没有兼容性，但是只能在dom0级事件绑定使用
    stopPropagation()   阻止冒泡
    事件代理：原理是利用事件冒泡，给父亲添加事件侦听器，将来操作的子元素。

鼠标事件

        onclick
        onmouseover        onmouseout       【冒泡】
        onmouseenter        onmouseleaver 【不冒泡】
        onfocus        onblur
        onmousemove/onmouseup/onmousedown

-mouseenter:不会冒泡
-mouseover:会冒泡

    键盘事件
        onkeyup
        onkeydown
        onkeypress
keyup,keydown可以识别
        keypress:功能键是无法识别的！ex:control shift 左右箭头
        键盘事件对象的keyCode,即event.keyCode:按键的ascii码     a:65//91
        keyup,keydown: 不能识别大小写   空格：32
        keypress:区分大小写

    event整理：
        clientX clientY         可视区域的x,y坐标
        pageX   pageY          页面文档
        screenX screenY         电脑屏幕

    event整理：
        clientX clientY         可视区域的x,y坐标
        pageX   pageY           页面文档
        screenX screenY         电脑屏幕

oninput:监听是否有输入的时候
contextmenu:阻止鼠标右键
box.innerText
box.innerHTML

Bootstrap模态框:JS组件

oninput事件：监听输入，处理<input>，<select>和 <textarea> 元素上的 input 事件。它还会在contenteditable 或 designMode打开的元素上处理这些事件。
与oninput不同的是， onchange 事件处理程序不一定会针对元素值的每次更改而调用。
let input = document.querySelector('input'); 
let log =document.getElementById('log'); 
input.oninput = handleInput; 
function handleInput(e) { 
  log.textContent = `The field's value is${e.target.value.length} character(s) long.`; 
}

阻止鼠标右键：

noContext = document.getElementById('noContextMenu');
noContext.addEventListener('contextmenu', e => {
  e.preventDefault();
});

p.addEventListener('contextmenu', function(e) {
// console.log("hello");
e.preventDefault();
});
p.addEventListener('selectstart', (e) => {
e.preventDefault();
});