HTML DOM学习
本文档参考菜鸟教程:http://www.runoob.com/htmldom/htmldom-tutorial.html
前提:
DOM Document Object Model(文档对象模型)的缩写
DOM 定义了访问 HTML 和 XML 文档的标准:
"W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。"
一、HTML DOM是什么?
HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。
二、HTML DOM 的组成(5个部分:节点、方法、属性、事件、控制台对象)
2.1 节点
HTML DOM 以树结构表达 HTML 文档。
HTML DOM对HTML文档结构为五种类型的节点: 文档节点(document)、2 元素节点、3 属性节点、4 文本节点、5 注释节点
2.2 方法:对元素节点的操作
2.3 属性:对属性节点和文本节点的操作。
2.4 事件:此处是HTML DOM ,此处的DOM事件也就是HTML事件:所有事件:http://www.runoob.com/jsref/dom-obj-event.html
注意:DOM属性节点和CSS样式不是一个东西!!! 对CSS样式操作:document.getElementById("p2").style
二、有哪些功能(知识例举几个常用的,全部的请看文章结束部分有链接!!!!)
三 、示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body> <p name="intro" id="intro">Hello World!</p> <script>
//新建元素节点
//var test=document.createElement("div");
//添加元素节点
var test=document.createElement("div");
//新建文本节点
//var node=document.createTextNode("这是一个新段落。");
//获取元素节点
//var test=document.getElementById("intro");
//var test=document.getElementsByTagName("intro");
//var test=document.getElementsByClassName("intro");
//
alert(test);
// //txt=document.getElementById("intro").childNodes[0].nodeValue;
//document.write(txt);
</script>
四、HTML DOM 各个组成部分到底有哪些方法??? http://www.runoob.com/jsref/obj-console.html
HTML DOM学习的更多相关文章
- 前端基础-BOM和DOM学习
JavaScript分为 ECMAScript,BOM,DOM. BOM:是指浏览器对象模型,使JavaScript有能力与浏览器进行对象. DOM:是指文档对象模型,通过它,可以访问HTML文档的所 ...
- HTML DOM 学习
HTML DOM 学习 By: Mirror王宇阳 E-mail:2821319009@qq.com 博客主页:https://www.cnblogs.com/wangyuyang1016/ DOM ...
- JavaScript DOM学习总结(一)
DOM 什么是DOM?简单地说DOM是一套对文档内容进行抽象和概念化的方法. W3C给出的DOM定义是这样的:"一个与系统平台和编程语言无关的接口,程序和脚本以通过这个接口动态的访问和修 ...
- Js dom 学习
节点类型 文档节点: 一棵DOM树的顶端是文档节点,它呈现为整个页面(相当于document对象),当需要访问任何元素.属性或文本节点时,都需要通过文档节点来进行导航.(document.) 元素节点 ...
- Dom学习笔记
今天老师出了一道面试题目:取到表单里面的textbox的值,两种方法.知道一种,老师说的什么dom,我竟然不知道. 以前学html的时候,老师也重来没有提到dom的概念.javaScript只是学了一 ...
- JavaScript DOM学习总结(二)
获取和设置属性 DOM实在是个好东西,掌握了它我们不仅可以在JavaScript中使用,其它程序语言我们同样可以使用. 接下来就一起使用DOM来干些实事吧! 1.getAttribute getAtt ...
- JS DOM学习笔记
1.window对象代表当前浏览器窗口 2.使用window对象的属性.方法的时候可以省略window.例如:window.alert("hello")一般写成alert(&quo ...
- HTML DOM学习之三
1.创建新的HTML元素:appendChild(); 如需向HTML DOM添加元素,首先必须创建该元素,然后把它追加到已有的元素上: <div id="div1"> ...
- HTML DOM学习之二
1.HTML DOM属性: **innerHTML属性-获取元素内容的最简单方法是使用innerHTML属性,innerHTML属性对于获取或替换HTML元素的内容很有用 <html> & ...
- HTML DOM学习之一
1.HTML DOM定义了访问和操作HTML文档的标准方法:DOM以树型结构表达了HTML文档: 2.DOM是W3C的标准,定义了访问HTML和XML文档的标准: DOM(文档对象模型)是中立于平台和 ...
随机推荐
- JS的小判断
// 0 if(undefined) { console.log('1'); } else { console.log('0'); } // 0 if(null) { console.log('1') ...
- [转]Golang TLS
首先是自签证书: openssl与数字证书的使用 https://blog.csdn.net/yue7603835/article/details/72569012 Golang TLS服务端/客户端 ...
- leetcode 3.Longest Substring Without Repeating Charcters
在一个字符串中寻找出最长的无重复字符的子串的,在不断的后续检索中需要去掉前面一个重复的字符,那么就是需要记录之前所出现过的字符的,在这里需要利用hashmap来记录字符和其出现的位置之间的映射关系的, ...
- java实现表格tr拖动
实现功能:js实现表格tr拖动,并保存因为拖动改变的等级. jsp代码 <div id="mainContainer"> <div class="con ...
- Linux 判断进程是否运行
问题 linux平台 多人开发服务器,有时自己运行一个进程在服务器上,但未知原因导致停止运行了,需要添加一个定时任务,用于监控指定进程是否运行 方法 一个通用的方法,以便使用在不同项目中. 思路:定时 ...
- 好久没考虑过的 sql 注入
很多年没考虑 sql 注入了,毕业以后 使用mybatis #{ 参数的 语法 },这个 语法已经 做了防止 sql 注入的处理 . 看到同事写的 ${ 参数 },突然 想到这个问题 . 下面聊聊 s ...
- 汉语言处理工具pyhanlp的拼音转换与字符正则化
汉字转拼音 HanLP中的汉字转拼音功能也十分的强大. 说明: l HanLP不仅支持基础的汉字转拼音,还支持声母.韵母.音调.音标和输入法首字母首声母功能. l HanLP能够识别多音字,也能给繁体 ...
- [转]阿里巴巴十年Java架构师分享,会了这个知识点的人都去BAT了
1.源码分析专题 详细介绍源码中所用到的经典设计思想,看看大牛是如何写代码的,提升技术审美.提高核心竞争力. 帮助大家寻找分析源码的切入点,在思想上来一次巨大的升华.知其然,并知其所以然.把知识变成自 ...
- Red-Gate.NET.Reflector.v8.0.1.308(内含注册机Keygen与注册图解)
Red-Gate.NET.Reflector.v8.0.1.308(内含注册机Keygen与注册图解) 反编译神器 内含软件安装包.注册机及插件集合. 这里说下注册方法,注意不要在联网的情况下注册 ...
- U3D学习13-数据存储
1.SQLLite 要注意Plguins的三个dll资源 2.利用ScriptableObject将数据存储为资源(小规模数据) using UnityEngine; using System.Col ...