【无标题】属性操作与事件

鼠标焦点获取与失去：

onfocus获取焦点事件：在鼠标光标获取输入框焦点时触发

onblur失去焦点事件：在鼠标光标失去焦点时触发。

input.οnblur=function(){

        console.log(this.value);

    }

鼠标单机与双击：

onclick单击事件：在鼠标指针单击时触发

ondblclick双击事件：在鼠标光标双击时触发。

box1.ondblclick = function () {

    this.style.backgroundColor = "yellow";

  }

键盘事件：

onkeydown：键盘按下  onkeyup:键盘抬起

 var input = document.querySelector('input')

    input.οnkeydοwn=function(){

        console.log('键盘按下');

    }

    input.οnkeypress=function(){

        console.log('键盘按压');

    }

    input.οnkeyup=function(){

        console.log('键盘抬起');

    }

浏览器事件：onload:浏览器加载完成执行      onscroll:滚动浏览器滚动条时触发

  window.onscroll = function () {

    console.log("滚动了！");

  } 

执行事件的步骤：获取元素、绑定事件、书写事件驱动程序

监听事件：btn.addEventListener("事件的类型",事件的处理程序) 

                btn.addEventListener("click",function) 

解绑监听：btn.removeEventListener("click", function);

事件对性的兼容性写法：var event = event || window.event;

元素坐标：clientX与clientY   事件被触发时鼠标与浏览器界面位置   原点在左上角

                pageX与e.pageY    事件被触发时鼠标与浏览器界面位置再加上滚动的距离

事件冒泡：子级元素事件被触发，父级也触发  且子级先触发

阻止冒泡：

var event = event || window.event;

    // propagation n. 传播;  英[ˌprɒpə'ɡeɪʃ(ə)n]

    event.stopPropagation();

阻止事件默认行为：event.preventDefault（）

阻止a链接跳转： <a href="https://www.baidu.com" οnclick="fn1(); return false">百度</a>

元素属性操作：

 getAttribute("属性"):不仅可以获取元素本身的属性的属性值，还可以获取元素自定义的属性的属性值

console.log(input.getAttribute("type"));

setAttribute('属性'，'值')可以设置元素属性

nput.setAttribute("type","password")

移除属性： removeAttribute("属性"):

div1.removeAttribute("name1");