1.HTML DOM定义了访问和操作HTML文档的标准方法:DOM以树型结构表达了HTML文档;

2.DOM是W3C的标准,定义了访问HTML和XML文档的标准:

DOM(文档对象模型)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容,结构和样式;

3.DOM标准分为3个不同的部分:

**核心 DOM:针对任何结构化文档的标准模型;

**XML DOM:针对XML文档的标准模型;

**HTML DOM:针对HTML文档标准模型;

4.XML DOM:定义了所有XML元素的对象和属性,以及访问它们的方法;

5.HTML DOM:关于如何获取,修改,添加或删除HTML元素的标准;

6.HTML DOM节点:在HTML DOM中,所有事物都是节点。DOM是被视为节点树的HTML

**整个文档是一个文档节点

**每个HTML元素是元素节点

**HTML元素内的文本是文本节点

**每个HTML属性是属性节点

**注释是注释节点

7.节点父,子和同胞:节点树的节点彼此拥有层级关系;

**父,子和同胞等术语用于描述这些关系;

**每一个节点都有父节点,除了根它没有(父节点);

**一个节点可拥有任意数量的子;

**同胞是拥有相同父节点的节点;

8.例如:

<html>

<head>

  <title>DOM Tutorial</title>

</head>

<body>

  <h1>DOM Lesson one</h1>

  <p>Hello world!</p>

</body>

</html>

**<html>节点没有父节点;它是根节点

**<head>和<body>的父节点是<html>节点

**文本节点"Hello world!"的父节点是<p>节点

9.HTML DOM方法:方法是我们可以在节点(HTML元素)上执行的动作:

(1)编程接口:

**可通过JavaScript(以及其他编程语言)对HTML DOM进行访问;

**所有HTML元素被定义为对象,而编程接口则是对象方法和对象属性;

**方法是您能够执行的动作(比如添加或修改元素)

**属性是能够获取或设置的值(比如节点的名称或内容)

(2)getElementById()方法:返回带有指定ID的元素

var element=document.getElementById("intro");

10.HTML对象-方法:

**getElementById(id)-获取带有指定id的节点(元素)

**getElementByTagName()-返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)

**getElementByClassName()-返回包含带有类名的所有元素的节点列表

**appendChild(node)-插入新的子节点

**removeChild(node)-删除子节点

**replaceChild()-替换子节点

**insertBefore()-在指定的子节点前面插入新的子节点

**createAttribute()-创建属性节点

**createElement()-创建元素节点

**createTextNode()-创建文本节点

**getAttribute()-返回指定的属性值

**setAttribute()-把指定属性设置或修改为指定的值

11.HTML DOM对象的属性:

**innerHTML-节点(元素)的文本值

**parentNode-节点(元素)的父节点

**childNodes-节点(元素)的子节点

**attributes-节点(元素)的属性节点

HTML DOM学习之一的更多相关文章

  1. 前端基础-BOM和DOM学习

    JavaScript分为 ECMAScript,BOM,DOM. BOM:是指浏览器对象模型,使JavaScript有能力与浏览器进行对象. DOM:是指文档对象模型,通过它,可以访问HTML文档的所 ...

  2. HTML DOM 学习

    HTML DOM 学习 By: Mirror王宇阳 E-mail:2821319009@qq.com 博客主页:https://www.cnblogs.com/wangyuyang1016/ DOM ...

  3. JavaScript DOM学习总结(一)

    DOM 什么是DOM?简单地说DOM是一套对文档内容进行抽象和概念化的方法.   W3C给出的DOM定义是这样的:"一个与系统平台和编程语言无关的接口,程序和脚本以通过这个接口动态的访问和修 ...

  4. Js dom 学习

    节点类型 文档节点: 一棵DOM树的顶端是文档节点,它呈现为整个页面(相当于document对象),当需要访问任何元素.属性或文本节点时,都需要通过文档节点来进行导航.(document.) 元素节点 ...

  5. Dom学习笔记

    今天老师出了一道面试题目:取到表单里面的textbox的值,两种方法.知道一种,老师说的什么dom,我竟然不知道. 以前学html的时候,老师也重来没有提到dom的概念.javaScript只是学了一 ...

  6. JavaScript DOM学习总结(二)

    获取和设置属性 DOM实在是个好东西,掌握了它我们不仅可以在JavaScript中使用,其它程序语言我们同样可以使用. 接下来就一起使用DOM来干些实事吧! 1.getAttribute getAtt ...

  7. JS DOM学习笔记

    1.window对象代表当前浏览器窗口 2.使用window对象的属性.方法的时候可以省略window.例如:window.alert("hello")一般写成alert(&quo ...

  8. HTML DOM学习之三

    1.创建新的HTML元素:appendChild(); 如需向HTML DOM添加元素,首先必须创建该元素,然后把它追加到已有的元素上: <div id="div1"> ...

  9. HTML DOM学习之二

    1.HTML DOM属性: **innerHTML属性-获取元素内容的最简单方法是使用innerHTML属性,innerHTML属性对于获取或替换HTML元素的内容很有用 <html> & ...

随机推荐

  1. 后台子线程(非主线程)更新UI引起的警告

    一.问题描述 -(void)sendAsynchronousRequest { NSLog(@"%@",[NSThread currentThread]); [SVProgress ...

  2. 迭代器iterator

    现在接着上篇的,写一来标识vector 的元素的对象迭代器iterator: 还是通过具体代码举例: 下面我讲了一个我暑期团队的故事哦~~: #include<iostream> #inc ...

  3. Javascript中最常用的55个经典技巧(转)

    1. oncontextmenu="window.event.returnValue=false" 将彻底屏蔽鼠标右键 <table border oncontextmenu ...

  4. [Android Pro] http请求中传输base64出现加号变空格的解决办法

    reference to : http://blog.csdn.net/jsjwbxzy/article/details/45970231 try { des = URLEncoder.encode( ...

  5. 模拟赛1103d1

    取模(mod) [题目描述] 有一个整数a和n个整数b_1, -, b_n.在这些数中选出若干个数并重新排列,得到c_1,-, c_r.我们想保证a mod c_1 mod c_2 mod - mod ...

  6. MongoDB csv文件导入导出

    1.导出到csv文件: 2.从csv导入: 数据经过csv导出导入,有一个非常隐蔽的问题,编写代码时需要注意: 先导入一条数据: 其中Price是double类型: 然后我把该条记录导出到Demo.c ...

  7. 素数环(dfs+回溯)

    题目描述: 输入正整数n,把整数1,2...n组成一个环,使得相邻两个数和为素数.输出时从整数1开始逆时针排列并且不能重复: 例样输入: 6 例样输出: 1 4 3 2 5 6 1 6 5 2 3 4 ...

  8. hdu 2020

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2020 思路:优先队列水过priority_queue #include <cstdio> ...

  9. mac版的PS和DW破解版安装

    到网上找到破解版的安装文件,一般是一个dmg安装文件,和一个补丁文件,安装的时候,要先断网,然后点击软件,选试用安装,安装完毕后,不要打开软件,直接关闭掉,然后到应用程序里找到软件图标,右击打开包文件 ...

  10. 使用HttpWebRequest发送自定义POST请求

    平时用浏览器看网页的时候,点击一下submit按钮的时候其实就是给服务器发送了一个POST请求.但是如何在自己的C#程序里面实现类似的功能呢?本文给出了一个简单的范例,可以实现类似的和web serv ...