构造函数其实就是一个使用new操作符调用的函数。当使用new调用时,构造函数内用到的this对象会指向新创建的对象实例,如下面的例子所示: 123456function Person(name, age, job) { this.name = name; this.age = age; this.job = job;}var person = new Person("aqingya", 18, "吴志广"); 上面这个例子中,Person构造函数使用this对象给三个属性赋值: name、age和 job。当和new操作符连用时,则会创建一个新的 Person对象,同时会给它 分配这些属性。问题出在当没有使用new操作符来调用该构造函数的情况上。由于该this对象是在运行时绑定的,所以直接调用Person(),this会映射到全局对象window.上,导致错误对象属性的意外增加。例如: 1234var person = Person("aqingya", 18, "吴志广& ...
在实际开发中,我们编写的大多数JavaScript代码包含大量的 if…else语句或者 try… catch 语句来做功能检测。举一个简单的例子:事件的绑定,我们会首先想到下列的代码 123456789var addHandler= function(element, type, handler) { if (element.addEventListener) { element.addEventListener(type, handler, false); } else if (element.attachEvent) { element.attachEvent("on" + type, handler); } else { element["on" + type] = handler; ...
XML E4X JSON AJAX
所有现代浏览器都内建了供读取和操作 XML 的 XML 解析器。 解析器把 XML 转换为 XML DOM 对象 - 可通过 JavaScript 操作的对象。JavaScript 访问的 XML DOM 对象。 解析 XML 文档123456789if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp = new XMLHttpRequest();} else { // code for IE6, IE5 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}xmlhttp.open("GET", "books.xml", false);xmlhttp.send();xmlDoc = xmlhttp.responseXML; 解析 XML 字符串123456789101112131415txt = &quo ...
为了让元素可拖动,需要使用 HTML5 draggable 属性。链接和图片默认是可拖动的,不需要 draggable 属性 在拖放的过程中会触发以下事件: 在拖动目标上触发事件 (源元素): ondragstart - 用户开始拖动元素时触发 ondrag - 元素正在拖动时触发 ondragend - 用户完成元素拖动后触发 释放目标时触发的事件: ondragenter - 当被鼠标拖动的对象进入其容器范围内时触发此事件 ondragover - 当某被拖动的对象在另一对象容器范围内拖动时触发此事件 ondragleave - 当被鼠标拖动的对象离开其容器范围内时触发此事件 ondrop - 在一个拖动过程中,释放鼠标键时触发此事件 将span拖放到div中 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757 ...
canvas绘图 canvas教程 WebGL教程
表单基础知识在JavaScript中,表单对应的是HTMLFormElement 类型,它继承了HTMLElement 。 acceptCharset:服务器能够处理的字符集;等价于HTML中的accept -charset特性。 action:接受请求的URL;等价于HTML中的action特性。 elements:表单中所有控件的集合( HTMLCollection )。 enctype:请求的编码类型;等价于HTML中的enctype特性。 length:表单中控件的数量。 method:要发送的HTTP请求类型,通常是”get”或”post”;等价于HTML的method特性。 name :表单的名称;等价于HTML的name特性。 reset () :将所有表单域重置为默认值。 submit () :提交表单。 target:用于发送请求和接收响应的窗口名称;等价于HTML的target特性。 document.forms 可以获取页面中的所有表单,返回一个集合,在这个集合中可以通过数值索引或者name值来获取特定的表单。 12var firstForm = doc ...
什么是事件事件就是文档或者浏览器窗口中发生的一些特定的交互瞬间。JavaScript与HTML是交互是通过事件来实现的。 事件流事件流描述的是从页面接受事件的顺序。 1、事件冒泡事件开始时由最具体的元素接收,然后逐渐向上传播到较为不具体的节点(文档) 2、事件捕获事件捕获的思想是不太具体的节点应该更早接收到事件,而最具体的节点应该最后接收到事件。事件捕获的用意是到达预定目标之前捕获它。 3、DOM事件流“DOM2级事件”规定的时间流包括三个阶段: 事件捕获阶段、处于目标的阶段和事件冒泡阶段。首先发生的是事件捕获,为截获事件提供了机会。然后是实际的目标接收到事件。最后一个阶段是冒泡阶段。 事件处理程序1、HTML事件处理程序12<input type="button" value = "点击" onclick = "alert('阿清呀')" /><input type="button" value = "点击" onclick = fun ...
DOM简介:通过 HTML DOM,JavaScript 能够访问和改变 HTML 文档的所有元素。 HTML DOM(文档对象模型)当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。 HTML DOM 模型被结构化为对象树: 对象的 HTML DOM 树 通过这个对象模型,JavaScript 获得创建动态 HTML 的所有力量: JavaScript 能改变页面中的所有 HTML 元素 JavaScript 能改变页面中的所有 HTML 属性 JavaScript 能改变页面中的所有 CSS 样式 JavaScript 能删除已有的 HTML 元素和属性 JavaScript 能添加新的 HTML 元素和属性 JavaScript 能对页面中所有已有的 HTML 事件作出反应 JavaScript 能在页面中创建新的 HTML 事件 什么是 DOM?DOM 是一项 W3C (World Wide Web Consortium) 标准。 DOM 定义了访问文档的标准: “W3C 文档对象模型(DOM)是中立于平台和语言的接 ...
遍历“DOM2级遍历和范围”模块定义了两个用于辅助完成顺序遍历DOM结构的类型: NodeIterator和TreeWalker。这两个类型能够基于给定的起点对DOM结构执行深度优先( depth-first )的遍历操作。 DOM遍历是深度优先的DOM结构遍历,也就是说,移动的方向至少有两个(取决于使用的遍历类型)。遍历以给定节点为根,不可能向上超出DOM树的根节点。 任何节点都可以作为遍历的根节点。如果假设元素为根节点,那么遍历的第一步 就是访问<p>元素,然后再访问同为<body>元素后代的两个文本节点。不过,这次遍历永远不会到达<html><head>元素,也不会到达不属于<body>元素子树的任何节点。而以document为根节点的遍历则可以访问文档中的全部节点。 下图展示了对以document为根节点的DOM树进行深度优先遍历的先后顺序。NodeIterator 和TreeWalker都以这种方式遍历。 1、NodeIterator使用document.createNodeIterator() 方法来创建它的 ...
公告
博客微信小程序版已上线,同步更新,请扫码浏览。🎉