事件处理程序事件处理程序即响应某个事件的函数事件处理程序以 “on” 开头如“onclick”，“onload” HTML事件处理程序某个元素支持的每种事件都可以使用一个与响应的事件处理程序同名的HTML特性来指定这个特性的值应该是能够执行的script代码如：<input type="button" value="click me" onclick="alert(‘clicked‘)"/>此外也可以直接调用在文档其它部分定义的函数作为事件处理程序所执行的代码如：<input type="button" value="...
1、 核心语法的学习 JS 变量类型 for .. in 语法 遍历JS对象属性 for循环、 if条件判断 函数定义三种方式function 函数名() {... }var 函数名 = function(){... }new Function(函数名， 参数 ，函数体)2、 全局函数 （系统函数 ） eval函数 ，将json字符串（{key;value} 、[对象，对象]）转换为js对象 parsetInt、parseFloat isNaN3、 内置对象String 字符串、Array 数组、Date日期 、...
HTML变动最大的版本应该就是HTML5了，这里就介绍一些 HTML5新增的DOM相关的API与类相关的扩充HTML4在普及后有一个十分重要的变化，即class属性使用的场景越来越多所以HTML5新增了许多API致力于简化CSS类的用法 1. getElemenetsByClassName（） 该方法接收一个参数（包含一个或多个类名的字符串），返回带有指定类名的元素的Nodelist，传入多个类名时类名的顺序没有影响2. classList属性 该属性保存有一个 DOMTokenList 的实例DOMTo...
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript">//测试removeChild()方法 删除节点window.onload = function() {//alert(1);var bjNode = document.getElementById("bj");//var c = bjNode.parentNode.removeChild(bjNode);//指向已经删除的节点//alert(c.firstChild.nodeValue);//为li节点添加一个confirmvar liNodes = document.getElementsByTagNam...
遍历“DOM2级遍历和范围” 定义了两个用于辅助完成顺序遍历的DOM结构类型NodeIterator 和 TreeWalk上述两种类型可以基于给定起点的DOM结构执行深度优先的遍历操作对于检测浏览器对于该功能的实现可以使用以下代码var supportTraversals = document.implementation.hasFeature("Traversal","2.0");var supportsNodeIterator = (typeof document.createNodeIterator === "function");var supportsTreeWalker = (typeof document.crea...
事件类型Web浏览器中可能发生的事件有许多种类型不同类型的事件都有着自己独特的信息在“DOM3级事件”规范中，规定了以下几类事件：UI事件 当用户与页面元素交互时触发焦点事件 当元素失去或获得焦点时触发鼠标事件 当用户通过鼠标在页面上执行操作时触发滚轮事件 当使用鼠标滚轮或类似设备时触发文本事件 当在文档中输入文本时触发键盘事件 当用户通过键盘在页面执行操作时触发合成事件 当为IME（输入法编辑...
操作富文本与富文本编辑器的交互的主要方式就是使用 document.execCommand() 方法该方法可以对文档执行自定义命令,并且可以应用大多数格式该方法接收三个参数:要执行命令的名称浏览器是否应该为当前页面提供用户界面执行命令的值为了保证跨浏览器的兼容性,最好保证第二个参数为 false,因为Firefox会在该参数为 true 时报错 命令值(第三个参数)说明backcolor颜色字符串设置文档的背景颜色boldnull将选中的文本转为粗体显示copynull将...
本文给大家分享我的javascript高级编程学习笔记之object和array引用类型，涉及到javascript引用类型相关知识，大家一起看看把。 1. Object类型大多数引用类型值都是Object类型的实例；而且Object也是ECMAScript中使用最多的一个类型。创建Object实例有如下两种方式： new操作符后跟Object构造函数：对象字面量表示法：2. Array类型除了Object之外，Array类型恐怕是ECMAScript中最常用的类型了。ECMAScript数组的每一项可以保存任何...
（1）平常写的函数大多是接受值，合并值，返回值，比如经常写的for循环: function printArray(array){for(var i=0;i<array.length;i++){print(array[i]); } }但是如果我们想做print之外的事情呢？怎么办？再写一个相似的，未免显得浪费，我们可以这样 function forEach(array,action){for(var i=0;i<array.length;i++){action(array[i]); } } forEach(["a","b","c"],print);通过利用匿名函数，在编写for循环之类的可以省去很多...
本文给大家分享我的javascript高级编程学习笔记之object和array引用类型，涉及到javascript引用类型相关知识，大家一起看看把。 1. Object类型 大多数引用类型值都是Object类型的实例；而且Object也是ECMAScript中使用最多的一个类型。 创建Object实例有如下两种方式： new操作符后跟Object构造函数：var person=new Object( );person.name="webb";person.age=25;对象字面量表示法：var person={name:"webb",age:25};2. A...
WebGL webgl 是针对 canvas 的 3D上下文，与其它Web技术不同，WebGL并非是W3C制定的标准，而是由 Khronos Group 制定的。 类型化数组 WebGL所涉及的复杂运算需要提前知道数值的精度，但是标准的 JS 无法支持这一诉求。 因此WebGL引入了类型化数组这一概念，类型化数组也是数组，与一般的数组没有什么区别，只不过这种数组中所有元素的值都被指定为某一特定类型。 类型化数组的核心在于 ArrayBuffer 这一数据类型，每个 ArrayBu...
模式 模式其实就是重复的图像，用来填充或描边图形 要创建一个新模式，可以调用 createPattern（）并传入两个参数一个HTML img元素 用于表示如何重复的字符串 "repeat" 重复 "repeat-x" 水平方向重复 "repeat-y" 垂直方向重复 "no-repeat" 不重复如:let image = document.images[0];let pattern = document.createPattern(image,"repeat");// 绘制矩形 context.fillStyle = pattern; context.fillRect (10,10,150,150); 需要注意的...
渐变 渐变由 canvasGradient 实例表示 要创建一个渐变对象需要调用 createLinearGradient() 方法 该方法接收四个参数:起点的x坐标 起点的y坐标 终点的x坐标 终点的y坐标调用该方法后会创建一个指定大小的实例,并返回一个 CanvasGradient 实例 创建渐变对象后需要指定色标,通过 addColorStop() 该方法接收两个参数:色标位置 CSS颜色值如:var gradient = context.createLinearGradient(30,30,70,70);gradient.addColorStop(0,"whi...
自动切换焦点 使用JS可以极大地提升表单的易用性 其中最常用的一种就是当用户填写完当前字段后焦点自动切换到下一个字段 以下方的HTML代码为例：<input type="text" name="tel1" id="txtTel1" maxlength="3"> <input type="text" name="tel2" id="txtTel2" maxlength="4"> <input type="text" name="tel3" id="txtTel3" maxlength="4">上方的代码给出了输入电话号码的例子 针对这样的HTML结构，我们可以使用下面的代码来完成自动...
事件对象 在触发DOM‘事件时，会产生一个事件对象 event 该对象包含着所有与事件有关的信息 所有浏览器都支持 event 对象但是支持的方式有所不同 DOM事件对象 兼容DOM的浏览器会将event对象传入事件处理程序中 如下所示：var btn = document.getElementByTagName("button")[0];btn.onclick = function(event){alert(event.type); //"click" }而通过HTML特性指定的事件处理程序，变量event保存着 event 对象<input type = "button...