//查找HTML元素
document.getElementById(ID);
document.getElementsByTagName(name);
document.getElementsByClassName(name);
//改变HTML元素
element.innerHTML = new html content; //改变元素的innerHTML
element.attribute = new value; //改变HTML的属性值
element.getAttribute(attribute); //判断属性是否存在
element.setAttribute(attribute,value); //改变HTML元素的属性值
element.style.property = new style; //改变HTML元素的样式
//添加和删除元素
document.createElement(element); //创建HTML元素
document.removeChild(element); //删除
document.appendChild(element); //添加
document.replaceChild(element); //替换
document.write(text); //写入HTML输出流
//添加事件处理程序
document.getElementById(id).onclick = function(){code} //向onclick事件添加事件处理程序
//查找HTML对象
document.anchors //返回拥有name属性的所有<a>元素。
document.applets //返回所有<applet>元素（HTML5不建议使用)
document.baseURI //返回文档的绝对基准URI
document.body //返回<body>元素
document.cookie //返回文档的cookie
document.doctype //返回文档的doctype
document.documentElement //返回<HTML>元素
document.documentMode //返回游览器使用的模式
document.documentURI //返回文档服务器的域名
document.embeds //返回所有<embed>元素
document.forms //返回所有<form>元素
document.head //返回所有<head>
document.images //返回所有<img>元素
document.implementation //返回DOM实现
document.inputEncoding //返回文档的编码（字符集）
document.lastModified //返回文档更新的日期和时间
document.links //返回拥有href属性的所有<area>和<a>元素
document.readyState //返回文档的(加载)状态
document.referrer //返回引用的URI（链接文档）
document.scripts //返回所有的<script>元素
document.strictErrorChecking //返回是否强制执行错误检查
document.title //返回<title>元素
document.URL //返回文档的完整URL
//查找HTML元素
//通过id查找HTML元素
//通过标签名查找HTNL元素
//通过类名查找HTML元素
//通过CSS选择器查找HTML元素
//通过HTML对象集合查找HTML元素
//改变HTML输出流
javaScript能够创建动态HTML内容：
在JavaScript中，document.write()可用于直接写入HTML输出流
！千万不要在文档加载后使用 document.write() 这么做会覆盖文档
//改变HTML内容
修改HTML文档内容最简单的方法是使用innerHTML属性。
//改变属性的值
document.getElementById(id).attribute = new value
例子：
<img id="image" src="/i/eg_smile.gif"></img>
<script>
document.getElementById("image").src = "/i/porsche.jpg";
</script>
<p>原始图像是 eg_smile.gif，但脚本将其更改为 porsche.jpg</p>
//DOM CSS
//HTML DOM 允许 JavaScript 更改HTML 元素样式
document.getElementById(id).style.property = new style
//使用事件
<button type="button" onclick="document.getElementById(ID).style.color = 'red' ">dian ji </button>
//JavaScript HTML DOM动画
function myMove() {
var elem = document.getElementById("animate");
var pos = 0;
var id = setInterval(frame, 2);
function frame() {
if (pos == 350) {
clearInterval(id);
} else {
pos++;
elem.style.top = pos + "px";
elem.style.left = pos + "px";
}
}
}
//JavaScript HTML DOM 事件
onclick = JavaScript
HTML事件的例子
当用户敲击案件时候
当用户点击鼠标时
当鼠标移至元素上时
当输入字段被改变时
当HTML表单被提交时
当网页加载后
当图片加载后
HTML事件属性
HTML DOM 来分配事件
onload 和 onunload 事件
当用户进入及离开页面时，会触发这两个事件。
onload事件可以用于检测访问者的游览器类型和游览器版本，然后基于该信息加载网页的恰当版本。
onload 和 onunload 事件可用于处理 cookie。
onchange 事件经常与输入字段验证结合使用。
onmouseover 和 onmouseout 事件
鼠标悬停 鼠标离开
onmousedown, onmouseup 以及 onclick 事件构成了完整的鼠标点击事件。
还有更多
参考完整的对象手册
JavaScript HTML DOM 事件监听器
addEventListener()方法
为指定元素指定事件处理程序。
为元素附加事件处理程序而不会覆盖已有的事件处理程序。
当使用 addEventListener() 方法时，JavaScript 与 HTML 标记是分隔的，已达到更佳的可读性；即使在不控制 HTML 标记时也允许您添加事件监听器。
语法element.addEventListener(event,function,useCapture);
第一个参数是事件的类型（比如 "click" 和 "mousedown")
第二个参数是当事件发生时我们需要调用的函数。
第三个参数时布尔值，指定使用事件冒泡还是事件捕获。此参数可选。
注意：请勿对事件使用 "on" 前缀；使用 'click' 代替 'onclick'。
事件冒泡还是事件捕获？
在 HTML DOM 中有两种事件传播的方法：冒泡和捕获。
事件传播是一种定义当发生事件时元素次序的方法。假如 <div> 元素内有一个 <p>，然后用户点击了这个 <p> 元素，应该首先处理哪个元素“click”事件？
在冒泡中，最内侧元素的事件会首先被处理，然后是更外侧的：首先处理 <p> 元素的点击事件，然后是 <div> 元素的点击事件。
在捕获中，最外侧元素的事件会首先被处理，然后是更内侧的：首先处理 <div> 元素的点击事件，然后是 <p> 元素的点击事件。
在 addEventListener() 方法中，你能够通过使用“useCapture”参数来规定传播类型：
removeEventListener() 方法
removeEventListener() 方法会删除已通过 addEventListener() 方法附加的事件处理程序：
element.removeEventListener("mousemove", myFunction);