HTML笔记文档,html超清晰学习笔记.docx

Html学习笔记

HTML DOM

HTML

文档对象模型(HTML Document Object Model )定义了( js)访问和处理 HTML文档的标 准方法。

节点

根据DOM，HTML文档中的每个成分都是一个节点。

DOM是这样规定的：

整个文档是一个文档节点(document)

?每个HTML标签是一个元素节点

包含在HTML元素中的文本是 文本节点

?每一个HTML属性是一个属性节点

?注释属于注释节点

节点彼此都有等级关系。

节点树

除文档节点之外的每个节点都有父节点(parentNode)。

大部分元素节点都有 子节点(firstChild ,lastChild)。比方说，＜head＞节点有一个子节点：＜title＞ 节点。＜title＞节点也有一个子节点：文本节点"DOM Tutorial"。

当节点分享同一个父节点时，它们就是同辈(同级节点)nextSibling,previousSibling 。

parentNode

访问节点

你可通过若干种方法来查找您希望操作的元素：

通过使用 getElementByld()和 getElementsByTagName()方法

通过使用一个元素节点的parentNode、firstChild 以及lastChild属性

getElementByld()可通过指定的ID 来返回元素：document.getElementByld("ID");

getElementsByTagName()方法会使用指定的标签名返回所有的元素(作为一个节点列表) 这些元素是您在使用此方法时所处的元素的后代。

document.getElementsByTagName(” 标签名称");

docume nt.docume ntEleme nt

docume nt.body

第一个属性可返回存在于XML以及HTML文档中的文档根节点。

第二个属性是对HTML页面的特殊扩展，提供了对

标签的直接访问。

var x=docume nt.getEleme ntByld("ma in div");

x.pare ntNode.removeChild(x);

节点信息

每个节点都拥有包含着关于节点某些信息的属性。这些属性是:

? no deName (节点名称)

? no deValue (节点值)

? nodeType (节点类型)

nodeName属性含有某个节点的名称。

兀素节点的

*属性节点的

文本节点的

?文档节点的

nodeName是标签名称 nodeName是属性名称 no deName 永远是 #text no deName 永远是 #docume nt

nodeValue

对于文本节点，nodeValue属性包含文本。 对于属性节点，nodeValue属性包含属性值。 nodeValue属性对于文档节点和元素节点是不可用的。

nodeType

nodeType属性可返回节点的类型。

兀素类型

节点类型

1

属性

2

3

6

文档

9

JavaScript 对象

Window 对象

Window对象代表一个浏览器窗口或一个框架。

Window 对象会在 ＜body＞或＜frameset＞每次出现时被自动创建。

1.方法

blur():让当前窗口失去焦点

alert():弹窗

setInterval()

setTimeout()

clearInterval()

clearTimeout()

close() : chrome可以直接关闭，ie会弹出提示，firefox不可用 focus():键盘焦点给与窗口

moveBy():相对于当前窗口位置移动指定像素

moveTo():把窗口移动到指定位置

open ()：打开一个新的浏览器窗口

Navigator 对象

Navigator对象实际上是一个JavaScript对象,而不是 HTML DOM 对象。

Navigator对象是由 JavaScript run time engine自动创建的，包含有关客户机浏览器的信息。

Scree n 对象

Screen对象实际上是 JavaScript对象，而不是 HTML DOM 对象。

Scree n对象是由 JavaScript run time engine自动创建的，包含有关客户机显示屏幕的信息。

History 对象

History对象实际上是 JavaScript对象，而不是 HTML DOM 对象。

History 对象是由 JavaScript run time engine自动创建的，由一系列的 URL 组成。这些 URL 是用户在一个浏览器窗口内已访问的URL。

Location 对象

Location对象是由 JavaScript run