Javascript学习二---DOM元素操作

Javascript 主要包括：JS的语法，DOM和BOM操作以及ECMAScript语法。

1 获取元素的方法

获取元素方法：

• 通过ID：document.getElementById(); 一个
• 通过标签：父级.getElementsByTagName();
• 通过class：父级.getElementsByClassName(); IE8及以下不支持
• 通过css选择器：

父级.querySelector(); 一个 IE7及以下不支持

             父级.querySelectorAll();

2 创建新节点

1. 　　createDocumentFragment() //创建一个DOM片段
2. 　　createElement() //创建一个具体的元素
3. 　　createTextNode() //创建一个文本节点

3 添加删除替换插入节点　　// 添加、移除、替换、插入

1. 　　appendChild()
2. 　　removeChild()
3. 　　replaceChild()
4. 　　insertBefore() //在已有的子节点前插入一个新的子节点

4 元素样式：
       元素.currentStyle.样式名 返回的值有单位 IE支持
       window.getComputedStyle(元素).样式名 返回的值有单位 标准浏览器支持(IE9及以上支持)

（获取元素样式兼容）

// 参数：元素, 样式名, 返回带单位样式值
function getStyle(obj, attr) {
    if (typeof(getComputedStyle) === 'function') {
        // 标准浏览器（IE9及以上）
        return getComputedStyle(obj)[attr];
    } else {
        // IE8及以下
        return obj.currentStyle[attr];
    }
}