常用js原生操作方法

JS原生操作DOM方法

通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。
JavaScript 能够改变页面中的所有 HTML 元素
JavaScript 能够改变页面中的所有 HTML 属性
JavaScript 能够改变页面中的所有 CSS 样式
JavaScript 能够对页面中的所有事件做出反应

我们需要通过javascript操作html元素，查找这些html元素有三种方法：

1.通过id查找：

var doc=document.getElementById("idName");

2.通过标签名查找：

var doc=document.getElementsByTagName("tagName");

3.通过类名查找：

var doc = document.getElementsByClassName("className");

例如：

document.getElementById(idName).style.color="red";

html dom使javascript有能力对html事件做出反应，你可以使用事件属性，
例如：

<button onclick="func()">点击</button>

你也可以使用javascript来向html元素分配事件，
例如：

document.getElementById("idName").onclick=function(){...};

添加和删除节点（HTML 元素）。
如需向html dom添加新元素，必须先添加元素节点，然后向该元素追加元素节点。
创建新的 p元素

var para=document.createElement("p");

创建文本节点

var node=document.createTextNode("这是新段落。");

向已有的元素追加新元素

var element=document.getElementById("div1");
element.appendChild(para);

当然上面也可以不创建新的元素，直接添加到已有的元素中，
例如：

var eleNode = document.createTextNode('这是新段落');
document.getElementById('div1').appendChild(eleNode);