dom对象

HTML DOM笔记

由 痞子三分冷 提交于 2020-01-02 09:46:53
什么是Dom? 　　通过Javascript, 您可以重构整个HTML文档。您可以添加、移除、改变或重排页面上的项目。 要改变页面的某个东西，Javascript 就需要获得HTML文档中所有元素进行访问的入口，这个入口，连同对HTML元素进行添加、移动、改变或移除的方法和属性，都是通过文档对象模型来获得（DOM）。 　　在1998年,W3C发布了一级的DOM规范。这个规范允许访问和操作HTML页面中的每一个单独的元素。 　　所有的浏览器都执行了这个标准，因此，DOM的兼容性问题也几乎难觅踪影了。 　　DOM可被Javascript用来读取、改变HTML、XHTML 以及XML文档。 DOM被分为不同的部分（核心、XML及HTML）和级别（DOM Level1/2/3）： Core DOM 　　定义了一套标准的针对任何结构化文档的对象。 XML DOM 　　定义了一套标准的针对XML文档的对象。 HTML DOM 　　定义了一套标准的针对HTML文档的对象。 --------------------------------------------------------------------------------------- DOM 级别 0 DOM 级别 0 不是 W3C 规范。而仅仅是对在 Netscape Navigator 3.0 和 Microsoft

JavaScript DOM

由 巧了我就是萌 提交于 2020-01-02 04:09:34
JavaScript DOM 　　版权声明：未经授权，严禁分享！　　 DOM 概述 　　 DOM （Document Object Model） 文 档对象模型 。 　　定义了访问和操作 HTML 文档的 API。 　　DOM 是 W3C（万维网联盟）的标准，W3C规定了所有的浏览器操作网页内容的统一API标准。 DOM 标准的 发展 历程 - DOM标准发展至今，共三级： 　　- DOM1级规范：98年最初的DOM规范，定义了文档的内容底层结构，所有的浏览器100%都兼容。 　　- DOM2级规范：基于DOM1级增加了许多交互模块，比如： 　　　　- 1、DOM Level 2 Core：基于 DOM1 扩展更多方法和属性。 　　　　- 2、DOM Level 2 Style：专门操作 HTML 样式的 API。 　　　　- 3、DOM Level 2 Traversal and Range ：专门遍历DOM树结构的API。 　　　　- 4、DOM Level 2 Event：标准化的事件 API，仅 IE8 不支持，自成一套。 　　- DOM3级规范：进一步扩展了方法和属性，添加了新类型。 DOM 标准 W3C DOM 标准被分为 3 个不停的部分。 　　- 核心 DOM 针对任何结构化文档的标准模型。 　　- XML DOM 针对 XML 文档的标准模型。 　　- HTML

Vue2 第四天学习(Vue的生命周期)

由 二次信任 提交于 2020-01-01 22:59:48
/*--> */ /*--> */ 阅读目录 1.理解VUE---混合 2.Vue实例化选项 3.Vue实例化的生命周期 回到顶部 1.理解VUE---混合 在了解Vue生命周期之前，我们先来学习Vue中的混合吧； 为什么需要使用混合？ 假如当我们开发时候，a.js和b.js都有公用的代码的时候，我们可以把他们抽取出来，在a.js或b.js的需要的时候可以引用进来即可，这可以简单的理解为混合。 混合对象可以包含任意组件选项，所有混合对象的选项将被混入该组件本身的选项。什么意思呢？可以简单的理解为该组件引入该混合对象的时候，该组件拥有该混合对象的所有属性和方法。 看下如下demo代码： <!DOCTYPE html> <html> <head> <title>演示Vue</title> </head> <body> <div id='app'> </div> </body> <script src="./vue.js"></script> <script type="text/javascript"> // 定义一个混合对象 var myMixin = { template: '<div>hello world</div>', methods: { hello: function() { console.log('hello'); }, say: function() {

jQuery初识

由 会有一股神秘感。 提交于 2020-01-01 03:48:52
jQuery初识 jQuery是什么？ jQuery是一个兼容多浏览器的JavaScript库。 jQuery能极大地简化JavaScript编程，它的宗旨就是："Write less,do more." jQuery包含以下内容： HTML元素选取 HTML元素操作 CSS操作 HTML事件函数 JavaScript特效和动画 HTML DOM遍历和修改 AJAX 下载链接： jQuery官网 jQuery对象 jQuery对象 就是通过jQuery包装DOM对象后产生的对象， jQuery对象 是jQuery独有的。 如果一个对象是 jQuery对象 ，那么它就可以使用 jQuery 里的方法：例如$(“#i1”).html()。 $(“#i1”).html()的意思是：获取id值为i1的元素的HTML代码，其中html()是jQuery里的方法。 相当于JavaScript中的document.getElementById("i1").innerHTML; 虽然jQuery对象是包装DOM对象后产生的，但是jQuery对象无法使用DOM对象的任何方法，同理DOM对象也不能使用jQuery也不能使用jQuery里的方法。 jQuery与JavaScript在申明变量的区别： 1 var $variable = jQuery对象 2 var variable = DOM对象 3

jQuery进行DOM操作记录

由 北慕城南 提交于 2019-12-31 23:42:37
1.在元素内部插入DOM元素 ①插入到元素内部原有元素之后 append(content) 返回值:jQuery 参数-content:要插入的元素String,Element,jQuery 为每一个匹配的元素内添加一些元素,参数既可以是字符串也可以是jQuery对象,如下: $("#1").append("input type='button' value='确定'/>") 在1的内部元素的后面添加一个按钮 $("#1").append($(".class")[0]) 在1的内部元素的后面添加css类为class的元素集中的第一个元素 appendTo(content) 返回值:jQuery 参数-content:被插入的元素StringElement,jQuery 把所有匹配的元素添加到指定的元素内,参数既可以是字符串也可以是jQuery对象,如下: $("#1").appendTo($("#2")) 在2的内部元素的后面添加1 ②插入到元素内部原有元素之前 prepend(content) 返回值:jQuery 参数-content:要插入的元素String,Element,jQuery prependTo(content) 返回值:jQuery 参数-content:要插入的元素String,Element,jQuery 它们分别与append(content

jQuery学习笔记：文档处理

由 那年仲夏 提交于 2019-12-31 23:40:47
转： http://blog.sina.com.cn/s/blog_677b66170100m1ke.html 一、 内部插入 1、 append(content) 向每个匹配的元素内部追加内容。这个操作与对指定的元素执行appendChild方法，将它们添加到文档中的情况类似。 返回值 jQuery 参数 content (String, Element, jQuery) : 要追加到目标中的内容 示例： // 向所有段落中追加一些HTML标记 $( " p " ).append( " <b>Hello,world.</b> " ); 2、 appendTo(content) 把所有匹配的元素追加到另一个、指定的元素元素集合中。 实际上，使用这个方法是 颠倒 了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。 返回值 jQuery 参数 content (String) :用于被追加的内容 示例： // 把所有段落追加到ID值为foo的元素中 $( " p " ).appendTo( " #foo " ); 3、 prepend(content) 向每个匹配的元素内部前置内容。这是向所有匹配元素内部的开始处插入内容的最佳方式。。 返回值 jQuery 参数 content (String, Element, jQuery) :

DOM元素的特性和属性

由 杀马特。学长 韩版系。学妹 提交于 2019-12-31 23:38:55
首先来看一下他们的概念： 特性(Attribute):是DOM元素在文档中作为html标签拥有的属性； 属性(Property):是DOM元素在js中作为对象拥有的属性； 首先来了解一下DOM的五个标准特性（id、title、lang、dir、class） 对于标准特性来说，Attribute和Property是同步的，是会自动更新的， 对于自定义的特性来说，他们是不同步的（自定义的特性不会自动 添加到property） HTML5规范对自定义特性做了增强，只要自定义特性以"data-attrName" 的形式写入到html标签中，在DOM属性中就可以通过element.dataset.attrName 的形式来访问自定义特性 特性/属性的数据绑定： 对于value和class来说，数据绑定是单方向的（Attribute==》property） 对于id、dir、title来说数据绑定是双向的（Attribute==》property、property ==》Attribute） 每一个元素都有一个或多个特性，用途是给出相应元素或其内容的 附加信息。通过DOM元素直接操作特性的方法有： .getAttribute（attrName） .setAttribute（attrname，value） .removeAttribute（attrName） 操作属性则直接用"."操作符

HTML DOM 创建与修改

由 笑着哭i 提交于 2019-12-31 23:37:44
修改 HTML 元素 修改 HTML DOM 意味着许多不同的方面： 改变 HTML 内容 改变 CSS 样式 改变 HTML 属性 创建新的 HTML 元素 删除已有的 HTML 元素 改变事件（处理程序） 在接下来的章节，我们会深入学习修改 HTML DOM 的常用方法。 建 HTML 内容 改变元素内容的最简答的方法是使用 innerHTML 属性。 下面的例子改变一个 <p> 元素的 HTML 内容： <!DOCTYPE html> <html> <body> <p id="p1">Hello World!</p> <script> document.getElementById("p1").innerHTML="New text!"; </script> <p>上面的段落被一段脚本改变了。</p> </body> </html> 改变 HTML 样式 通过 HTML DOM，您能够访问 HTML 元素的样式对象。 下面的例子改变一个段落的 HTML 样式： <html> <body> <p id="p2">Hello world!</p> <script> document.getElementById("p2").style.color="blue"; </script> </body> </html> 创建新的 HTML 元素 如需向 HTML DOM 添加新元素

HTML DOM - 修改

由 徘徊边缘 提交于 2019-12-31 23:37:31
修改 HTML = 改变元素、属性、样式和事件。 修改 HTML 元素 修改 HTML DOM 意味着许多不同的方面： 改变 HTML 内容 改变 CSS 样式 改变 HTML 属性 创建新的 HTML 元素 删除已有的 HTML 元素 改变事件（处理程序） 在接下来的章节，我们会深入学习修改 HTML DOM 的常用方法。 创建 HTML 内容 改变元素内容的最简答的方法是使用 innerHTML 属性。 下面的例子改变一个 <p> 元素的 HTML 内容： 实例 <!DOCTYPE html> <html> <body> <p id="p1">Hello World!</p> <script> document.getElementById("p1").innerHTML="New text!"; </script> <p>上面的段落被一段脚本改变了。</p> </body> </html> 查看结果: New text! 上面的段落被一段脚本改变了。 改变 HTML 样式 通过 HTML DOM，您能够访问 HTML 元素的样式对象。 下面的例子改变一个段落的 HTML 样式： 实例 <!DOCTYPE html> <html> <body> <p id="p1">Hello world!</p> <p id="p2">Hello world!</p> <script>

JavaScript四（DOM编程）

由 元气小坏坏 提交于 2019-12-31 23:35:37
一.绪论 DOM是文档对象模型（Document Object Module）的简称，借助DOM模型，可以将结构化文档，转换成DOM树，程序可以访问，修改，增加，删除树的节点。程序通过操作DOM树时，结构化文档也会随之 动态改变。 DOM并不是一种技术，它只是访问结构化文档的一种思想，各种语言都有自己的DOM解释器。 DOM为常用的HTML元素提供了一整套的继承体系，从页面的document对象到每个常用的HTML元素，DOM模型都提供了对应的类，每个类都提供了相应的方法来操作元素本身，属性及其子元素。DOM模型允许 以树的形式操作HTML文档的每一个元素。 HTML中，Node，Document，Element，HTMLELement都是普通HTML元素的超类，不直接对应于HTML页面的控件。但他们所包含的方法也可被其他页面元素调用。 二.访问HTML元素 1.根据Id访问HTML元素 document.getElementById(idVal): 返回文档中Id属性为idVal的HTML元素 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>根据Id访问HTML元素</title> <script type="text/javascript"> var accessById =
订阅 dom对象