js:DOM及其操作2

事件三要素

• 事件源:触发(被)事件的元素
• 事件类型:事件的触发方式(例如鼠标点击或键盘点击)
• 事件处理程序:事件触发后要执行的代码(函数形式)

事件的基本使用

var box = document.getElementById('box');

box.onclick = function() {

 console.log('代码会在box被点击后执行');  

};

在某个元素的事件中，自己的事件中的this就是当前的元素对象

属性操作

非表单元素属性

核心DOM：可以操作一切API

举例：

var alink = document.getElementById(“aLink”);

获取属性值：

alink.getAttribute(“href”);

修改属性值：

alink.setAttribute(“href”,”baidu.com”);

判断是否包含指定的属性值（在html标签中有定义的属性）

Var bool = alink.hasAttribute(“target”);

移除属性值

alink.removeAttribute(“title”);

HTML DOM:对核心DOM常用的API进行简化

获取属性值：

alink.href;

修改属性值：

aLink.href = “baidu.com”;

判断是否包含属性

var bool = aLink.target = =“”;

移除属性

aLink.title = “”;

凡是css中这个属性是多个单词的写法，在js代码中DOM操作的时候，把—去掉，后面的单词大写即可

表单元素

• value 用于大部分表单元素的内容获取(option除外)
  • type 可以获取input标签的类型(输入框或复选框等)
  • disabled 禁用属性
  • checked 复选框选中属性
  • selected 下拉菜单选中属性

规律：在表单标签中，如果属性和值只有一个，并且值是这个属性本身，那么在写js代码DOM 操作的时候，这个属性值是布尔类型就可以了

如checked selected disabled（禁用）文本域中的属性redonly（只读，只能获取，不能修改）