html打字,JS HTML DOM 打字

//查找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属性的所有元素。

document.applets                //返回所有元素(HTML5不建议使用)

document.baseURI                //返回文档的绝对基准URI

document.body                   //返回

元素

document.cookie                 //返回文档的cookie

document.doctype                //返回文档的doctype

document.documentElement        //返回元素

document.documentMode           //返回游览器使用的模式

document.documentURI            //返回文档服务器的域名

document.embeds                 //返回所有元素

document.forms                  //返回所有

元素

document.head                   //返回所有

document.images                 //返回所有元素

document.implementation         //返回DOM实现

document.inputEncoding          //返回文档的编码(字符集)

document.lastModified           //返回文档更新的日期和时间

document.links                  //返回拥有href属性的所有和元素

document.readyState             //返回文档的(加载)状态

document.referrer               //返回引用的URI(链接文档)

document.scripts                //返回所有的元素

document.strictErrorChecking    //返回是否强制执行错误检查

document.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

例子：

document.getElementById("image").src = "/i/porsche.jpg";

原始图像是 eg_smile.gif，但脚本将其更改为 porsche.jpg

//DOM CSS

//HTML DOM 允许 JavaScript 更改HTML 元素样式

document.getElementById(id).style.property = new style

//使用事件

dian ji 

//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 中有两种事件传播的方法：冒泡和捕获。

事件传播是一种定义当发生事件时元素次序的方法。假如 

 元素内有一个 

，然后用户点击了这个 

 元素，应该首先处理哪个元素“click”事件？

在冒泡中，最内侧元素的事件会首先被处理，然后是更外侧的：首先处理 

 元素的点击事件，然后是 

 元素的点击事件。

在捕获中，最外侧元素的事件会首先被处理，然后是更内侧的：首先处理 

 元素的点击事件，然后是 

 元素的点击事件。

在 addEventListener() 方法中，你能够通过使用“useCapture”参数来规定传播类型：

removeEventListener() 方法

removeEventListener() 方法会删除已通过 addEventListener() 方法附加的事件处理程序：

element.removeEventListener("mousemove", myFunction);