Js DOM对象

DOM

Dom Document Object Model 文档对象模型它主要是用于操作和访问网页各标记（标签）的属性和方法

首先明确：

????1、在DOM中把HTML中的每一个标签都当作为一个对象

????2、该标签拥有哪些属性那么该对象就拥有

HTML文档它是具有一定层次关系

HTML文档有且只有一个<html>

1、Dom节点树

父节点

子节点

兄弟节点它们同时拥有一个父节点

文本节点

2、节点类型

Document节点根节点

Element节点元素节点

Attribute节点属性节点

Text节点文本节点

3、DOM分类

核心DOM 主要是操作HTML和XHTML 提供了一些属性和方法

HTML DOM 主要是操作HTML 提供一些属性和方法

XML DOM 主要是操作XML

CSS DOM 主要是操作CSS

Event DOM 主要是操作事件

4、核心DOM操作

1、常见的属性

nodeName 节点名称

firstChild 第一个子节点

lastChild 最后一个子节点

parentNode 父节点

childNodes 子节点列表它其实就是一个集合

2、对标签属性的操作

获取属性

你要获取的对象.getAttribute("属性名")

设置属性

setAttribute("属性名","属性值")

删除属性

removeAttribute("属性名")

3、对标签的操作

1、创建节点（元素）

????语法：

????????Document.createElement("标签名")

返回值是一个元素对象

2、添加节点（元素）

语法：

父对象.appendChild(元素对象)

3、删除节点

????语法：

????????父对象.removeChild(子元素对象)

5、HTML DOM的操作

因为核心DOM操作HTML文档过于繁琐那么就有了html dom

Document.getElemetById("ID属性值")

说明：

????通过ID的属性值来获取一个对象

这个方法只有document才有

返回一个标签对象获取的是什么标签就是什么标签对象

父对象.getElementsByTagName("标签名")

说明：

????这个方法它获取到的是一个集合就算你获取只有一个它也是一个集合

????它的访问方式和访问数组元素是一样的对象名[下标]

????这个方法每一个父对象都拥有

时间： 2024-10-18 02:06:01

Js DOM对象的相关文章

JS & DOM 对象

22:36 2013/6/4 详情参照W3C文档标准 Browser 对象(顶层对象) DOM Window DOM Navigator DOM Screen DOM History DOM Location HTML DOM 对象 DOM Document DOM Anchor DOM Area DOM Base DOM Body DOM Button DOM Canvas DOM Event DOM Form DOM Frame DOM Frameset DOM IFrame DOM Ima

JS DOM对象，控制HTML元素

1.认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面代码: 将HTML代码分解为DOM节点层次图: HTML文档可以说由节点构成的集合,DOM节点有: 1. 元素节点:上图中<html>.<body>.<p>等都是元素节点,即标签. 2. 文本节点:向用户展示的内容,如<li>...</li>中的Ja

js Dom对象的属性与方法

1.对象集合: (1).all[]; (2).images[]; (3).anchors[]; (4).forms[]; (5).links[]; 2.属性: document.cookie;设置或返回当前文档有关的所有cookie document.title;返回当前文档的标题 document.domain:返回当前文档的域名 document.URL;返回当前文档的URL document.referrer 如果当前文档不是通过超级链接访问的,则为 null 这个属性允许客户端 Java

JS DOM对象与jQuery对象的转换

JS转jQuery // 直接用$()来包裹如同$(this) $(document) var jsObj = document.getElementById('test'); var jqueryObj = $(jsObj); jQuery转JS // 下标 [0] 或.get(index)方法 var jqueryObj = $('#test'); var jsObj = jqueryObj[0]; var jsObj = jquryObj.get(0);

DOM对象和js对象以及jQuery对象的区别

一.DOM对象文档对象模型简称DOM,是W3C组织推荐的处理可扩展置标语言的标准编程接口. DOM实际上是以面向对象方式描述的文档模型.DOM定义了表示和修改文档所需的对象.这些对象的行为和属性以及这些对象之间的关系. 通过DOM,可以访问所有的 HTML 元素,连同它们所包含的文本和属性.可以对其中的内容进行修改和删除,同时也可以创建新的元素. HTML DOM 独立于平台和编程语言.它可被任何编程语言诸如 Java.JavaScript 和 VBScript 使用. DOM对象,即是我们用

认识JQuery，JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作，常用的方法

(一)认识JQuery JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法 JQuery的主旨:以更少的代码,实现更多的功能 (二)JQuery的优势 1)可以像CSS一样访问和操作DOM 2)修改CSS控制页面外观 3)简化JS代码操作 4)事件代理更加容易 5)动画效果使用方便 6) Ajax技术更加完美 7)大量的基于Jquery的插件 8)可以自定义扩展功能插件 (三)JQuery的语法格式:$(selector).actio

JS and DOM 对象列表

JavaScript 对象(9个) JS Array JS Boolean JS Date JS Math JS Number JS String JS RegExp JS Functions JS Events Browser 对象(5个) Window Navigator Screen History Location HTML DOM 对象(4个) DOM Document DOM Element DOM Attribute DOM Event HTML 对象(...) <a> <

JS中的DOM对象及JS对document对像的操作

DOM对象 windows:属性:opener(打开者) 方法:open().close(),setTimeout().setInterval()... location:属性:href 方法:reload()刷新 history:方法:go() status:不常用 document:下面详细介绍 JS对document对像的操作分两个: 找到对象.操作对象. 找到对象的方法:document.getElementById().document.getElementsByName(). do

HTML DOM对象的属性和方法介绍(原生JS方法)

HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口),它允许程序和脚本动态地访问和更新文档的内容,结构和样式. W3C DOM 标准被分为 3 个不同的部分: 核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型 HTML DOM 定义了所有 HTML 元