dom 笔记】的更多相关文章

一.RegExp ECMAScript通过RegExp类型类支持正则表达式,语法和Perl类似: var exp = /pattern/flags; patternb部分是任何简单的或复杂的正则表达式:flags是每个正则表达式所带的一个或者多个标志. 正则表达式的模式匹配支持三个标志: g:全局模式,即模式应用于整个字符串,而非在发现第一个匹配项时立即停止 i:不区分大小写模式 m:多行模式,即到达一行文本末尾是还会继续茶查找下一行中是否存在与模式匹配的项. 1.创建正则表达式 JavaScr…
在上一篇笔记本中,讲解了如何利用jQuery扩展全局函数和对象:DOM笔记(六):怎么进行JQuery扩展? 在这篇笔记本中,将开发一个简单的动画插件,名称是example-plugin,用其实现一个简单的功能:光标移动到目标标签,标签移动,改变背景色:光标离开时,标签恢复原来的样式. 因为是jQuery对象的扩展,采用jQuery.fn.extend()进行扩展,插件名是dwqs,并且使用闭包: /* *示例插件功能: *光标移动到目标标签,标签移动,改变背景色:光标离开时,标签恢复原来的样式…
一.常见事件类型 1.鼠标事件 事件名称 说明 onclick 鼠标单击时触发 ondbclick 鼠标双击时触发 onmousedown 鼠标左键按下时触发 onmouseup 鼠标释放时触发 onmouseover 鼠标的光标移动到某对象上时触发 onmousemove 鼠标移动时触发 onmouseout 鼠标光标离开某对象时触发 ps: 当单击一次鼠标左键的时候,将同时触发onclick.onmousedown.onmouseup三个事件,事件处理程序执行的先后顺序 为:onmoused…
HTML 5 DOM定义了一下集合.列表等复杂的数据类型用于实现便捷的操作.相对于HTML 4 DOM,HTML 5 DOM增加了HTMLCollection.DOMTokenList.DOMStringMap.HTMLAllCollection. HTMLFormControlsCollection等. 一.HTMLCollection.HTMLAllCollection和HTMLFormControlsCollection 三个接口均用于表示一组元素组成的列表.HTMLAllCollecti…
一.Element接口 Element接口表示一个元素,该接口扩展自Node接口,自然继承了Node接口的属性和方法,也有一套针对元素的属性和方法. Element接口常见的属性比较少,常用的就是一个只读的tagName属性,该属性返回元素名,数据类型是DOMString. Element接口定义的方法也主要是针对属性操作,常见方法如下: 方法名 数据类型 说明 getAttribute DOMString 返回对应属性 getAttributeNode Attr 返回对应属性节点 getAtt…
所有的节点都使用Node接口来表示,可以使用很多方法去获取节点,如document.getElementsByTagName().document.getElementsByName()等均返回一个NodeList对象,然后获取其中的节点. 节点对应的属性和放大均在Node接口予以定义: 1.Node接口常见的属性列表 属性名 数据类型 说明 nodeName DOMString 返回节点名 nodeValue DOMString 返回节点值 nodeType int 返回节点类型(见后文) p…
操作HTML文档的第一步就是获取对文档元素的引用,每一个元素在DOM中就是一个节点,所有的元素在DOM中构成一个节点树. 用于获取元素节点定义的方法定义于HTMLDocument接口,window.document方法用于实现该接口,其定义的常用方法和属性如下: 属性或方法 返回值类型 说明 [getter] 任何类型 根据元素的name属性获取所有元素节点 all HTMLAllCollection 文档中所有元素组成的集合,已不推荐使用 body HTMLElement 获取<body>元…
一.RegExp ECMAScript通过RegExp类型类支持正則表達式,语法和Perl类似: var exp = /pattern/flags; patternb部分是不论什么简单的或复杂的正則表達式:flags是每一个正則表達式所带的一个或者多个标志. 正則表達式的模式匹配支持三个标志: g:全局模式,即模式应用于整个字符串.而非在发现第一个匹配项时马上停止 i:不区分大写和小写模式 m:多行模式,即到达一行文本末尾是还会继续茶查找下一行中是否存在与模式匹配的项. 1.创建正則表達式 Ja…
在Java.C++.C#等OO语言中,都支持两种继承方式:接口继承和实现继承.接口继承制继承方法签名,实现继承则继承实际的方法和属性.在SCMAScript中,由于函数没有签名,所以无法实现接口继承,只支持实现继承. 实现继承主要依靠原型链来实现. 一.原型链 原型链是利用原型让一个引用类型继承另一个引用类型的方法,在DOM笔记(十二):又谈原型对象中,描述了构造函数.实例和原型之间的关系: 每个构造函数都有一个原型对象,原型对象包含一个指向构造函数的指针,而每个实例都包含一个指向原型对象的内部…
因为之前谢过一篇关于原型对象的笔记:浅谈JavaScript中的原型模式.现在我又重新看到这个话题,对原型有了进一步的理解,所以,又要谈谈原型对象. 一.理解原型对象 创建的每一个函数都有一个prototype属性,它指向这个函数的原型对象.利用原型模式创建的方法和属性是被所有实例所共享的. function Person(){} Person.prototype.name="dwqs"; Person.prototype.age=20; Person.prototype.sayNam…
一.执行环境 在有关于JavaScript对象或者this的指向问题时,脱离不了的另外一个概念就是执行环境,即上下文环境.执行环境在JavaScript是一个 很重要的概念,因为它定义了变量或函数有权访问的其它数据,决定了它们各自的行为.每个执行环境都有一个与之关联的变量对象,在该环境中定义的所有变量和 函数都保存在这个对象中. 全局环境时最外围的一个执行环境.在Web浏览器中,全局环境被认为是Window对象(后续笔记中会讨论),因此所有的全局变量和函数都是作为window对象的属性或者方法创…
一.前言 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model).HTML DOM 模型被构造为对象的树 通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML. JavaScript 能够改变页面中的所有 HTML 元素 JavaScript 能够改变页面中的所有 HTML 属性 JavaScript 能够改变页面中的所有 CSS 样式 JavaScript 能够对页面中的所有事件做出反应 二.查找 HTML 元素 通过 id…
一.Array 1 .创建数组的方式 //Array构造函数(可以去掉new) var colors0 = new Array(); var colors1 = new Array(20); var colors3 = new Array("red","blue","green"); //数组字面量 var colors4 = ["red","blue","green"]; var co…
一.全局函数的扩展 全局函数是将独立的函数添加到JQuery的命名空间中区.在使用的时候,可以通过$.fucnName(param)或者jQuery.funcName(param)方式进行调用. 1.直接在JQuery上添加:在jQuery上添加一个全局函数sayHello jQuery.sayHello=function(name) { alert(name+"您好"); }; 调用方式: jQuery.sayHello("张子涵"); //或者用$.sayHel…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>dom</title> <script> /** * 子节点 childNode (有兼容问题) * ie6-8 没问题 * nodeType==3 文本节点 * nodeType==1 元素节点 * children 都兼容 * 父节点 par…
第十章 DOM 一 Node类型 共有12种节点类型,每个节点都有nodeType属性,用于表明节点类型,nodename 表示标签名称 nodeValue始终为null 1.操作节点 a)  appendChild()方法 用于向childNodes的列表最后添加节点,添加后相应的节点都会得到更新.如果出入到appendChild()中的节点已经是文档的一部分了,那结果就是将该节点从原来的位置移到新位子. b) 如果要把节点放到childNodes列表中某个特定的位置,而不是末尾.可以使用in…
以下内容来自<javasript DOM 编程艺术>第二版 dom中三种重要的节点:元素节点.属性节点.文本节点. 几种节点的重要属性:nodeValue,nodeType(为数字1.2.3). 子节点属性:childNodes,firstChild=.childNodes[0],lastChild=.childNodes[.childNodes.length-1]. .js文档在加载完成之后立即开始执行. p69 在html文档全部加载完毕时将会触发onload事件,document对象是w…
一.什么是对象? 面 向对象(Object-Oriented,OO)的语言有一个标志,那就是都有类的概念,例如C++.Java等:但是ECMAScript没有类的概 念.ECMAScript-262把对象定义为:无序属性的集合,其属性可以包含基本值.对象或者函数.通俗一点的理解就是,ECMAScript中的对 象就是一组数据和功能的集合,通过new操作符后跟要创建的对象类型的名称来创建.每个对象都基于一个引用类型创建.引用可以是原生类型(相关介绍:引用类型),或者开发人员自定义的类型. 二.Ob…
一.概念理解: 关于Element跟Node的区别,cilldren跟childNodes的区别很多朋友弄不清楚,本文试图让大家明白这几个概念之间的区别. Node(节点)是DOM层次结构中的任何类型的对象的通用名称,Node有很多类型,如元素节点,属性节点,文本节点,注释节点等,通过NodeType区分,常见的有: 节点类型 NodeType 元素element 1 属性attr 2 文本text 3 注释comments 8 文档document 9 更多节点类型参考:https://dev…
DOM节点的种类 元素和标签是一个意思,例如<body>标签或者称为<body>元素 节点DOM的节点分为三类  元素节点,文本节点,属性节点 例如 <div id=‘box’>例子</div>  其中元素节点就是指这个div,文本节点就是指‘例子’这个文本,属性节点是指id 查找和定位节点 查找元素JS提供的几种方法: getElementsById() document.getElementsById()DOM操作必须要等到HTML文档加载完毕才能进行怎…
js的组成     ECMAScript:JS的语法     DOM:页面文档对象模型     BOM:浏览器对象模型     web APIs     是浏览器提供的一套操作浏览器功能和页面元素的API     主要学习的是DOM和BOM     web APIs是JS独有的     主要学习页面交互功能     API:应用程序编程接口 // 获取元素 var p1 = document.getElementById("text") console.log(p1); console…
1.监听div内容修改 1.1 DOM2级中的mutation(变动事件)里的 DOMSubtreeModified 可以监听div内容修改 document.querySelector('.element').addEventListener('DOMSubtreeModified', function(){ alert(this); }); 1.2MutationObserver构造函数可以监听div内容修改 //兼容性 var MutationObserver = window.Mutat…
1,获取元素方法: (1),获取单个,返回一个元素 element.getElementById()//最快,实时 element.querySelector() (2)获取多个,返回一组 element.getElementsByTagName() element.getElementByClassName() element.getElementByName()//常用于表单元素 element.querySelectorAll()//查找速度比上面三个块,为静态的,非实时的,在加载时获取…
<!-- 节点类型检查 if(someNode.nodeType==ElementNode){ alert("Node is an element"); } 或者 if(someNode.nodeType==1){ alert("Node is an element"); } 使用nodeName和nodeValue这两个属性 if(someNode.nodeType==1){ var someNode.nodeName();//nodeName的值是元素的标…
node节点属性 nodeName属性 oneBox= document.getElementsById('box');var s = oneBox.nodeName;  //nodeName与tagName等价 nodeType属性 表示节点的类型,其中1代表元素节点,2代表属性节点,3代表文本节点. nodeValue属性 表示节点的内容,其中元素(标签)节点的nodeValue值为null,属性节点的值为属性值,文本节点的值为文本内容,这个内容不包括html语句 层次节点 var s =…
DOM笔记一.DOM简介 Document Object Model 文档对象模型 DOM的节点树模型:整个文档按照从大到小的节点划分,每一个内容都算作一个节点 DOM API 编程接口 可以用来操作页面的任意一部分内容 js+DOM编程的思想:由js基本语法控制程序的执行逻辑,由DOM API进行元素的查找获取,进而再对元素进行增删改等操作 学习DOM,除开学习设计思想外,更多的是学习DOM API的用法 二.document对象 document对象, 是Windows对象的一个属性, 表示…
                                    DOM对象模型  DOM(Document Object Model),是指文档对象模型,是W3C组织推荐的处理可扩展标志语言的标准编程接口.在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型. [DOM树节点]    DOM节点分为三大类:元素节点,文本节点,属性节点:   文本节点,属性节点为元素节点的两个子节点:   通过getElment系列方法,可以去到元素节点: [查看节点]…
上回书说道,JS中变量.运算符.分支结构.循环和嵌套循环等内容.本回就由本K给大伙唠唠JS中的BOM.DOM和事件. 一."花心大萝卜"--BOM 1.震惊,FFF团为何对BOM举起了火把--BOM简介 BOM(Browser Object Model) 是指浏览器对象模型,在JS中BOM是个不折不扣的花心大萝卜,因为它有很多个对象,其中代表浏览器窗口的Window对象是BOM的"正室".也就是最重要的,其他对象都是正室的下手.或者叫侧室也不足为过. 2.细数BOM…
一.什么是BOM      BOM(Browser Object Document)即浏览器对象模型.      BOM提供了独立于内容 而与浏览器窗口进行交互的对象:      由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对象是window:      BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性:      BOM缺乏标准,JavaScript语法的标准化组织是ECMA,DOM的标准化组织是W3C,BOM最初是Netscape浏览器标准的一部分.   二.学习B…
原文:mysql_connect v/s mysql_pconnect 译文:mysql_connect v/s mysql_pconnect 译者:dwqs 当需要使用PHP连接MySQL数据库的时候,会发现有两种数据库连接函数:mysql_connect()和mysql_pconnect(). 1.mysql_connect() 在脚本开始的时候,mysql_connect()会创建一个新的连接,脚本结束的时候就会关闭连接.脚本每一次执行,它都会创建一个新的连接. 2.mysql_pconn…