木槿花开

一、virtual dom介绍virtual dom定义：是一个由标签名tag、属性props和子元素对象children等构成的js对象。var vdom= { tag: 'ol', // 标签名 props: { // 属性用对象存储键值对 id: 'ol-list' }, children: [ // 子节点 {tag: 'li', props: {c...

随着JS模块化编程的发展，处理模块之间的依赖关系成为了维护的关键,AMD,CMD,CommonJS是目前最常用的三种模块化书写规范。一、CommonJSCommonJS规范是诞生比较早的，NodeJS就采用了CommonJS。Node、CommonJS、浏览器和W3C之间关系：  |---------------浏览器----- ------------------|      

图片轮播原生实现：自动轮播播放前后按钮控制翻页先晒效果图如下：一、图片轮播HTML代码

排序算法1、冒泡排序function bubbleSort(arr){ var i = j = 0; for(i=1; i<arr.length; i++){ for(j=0; j<=arr.length-i; j++){ var temp = 0; // ">" 从小到大排序 // " if(arr[j] > arr[j

1. 什么是跨域？具体概念如下：只要协议、域名、端口有任何一个不同，都被当作是不同的域。跨域是指通过一些方法使本域的js能够操作其他域的页面对象或者使其他域的js能操作本域的页面对象（iframe之间）。下面是具体的跨域情况详解：URL 说明 是否允许通信http://www.a.com/a.jshttp://www.a.c

下面采用HTML+CSS+JavaScript实现模态框，并采用Flex布局和多媒体查询实现响应式。一、模态框HTML代码 模态框实现 模态框展示 模态框标题 × HTML+CSS+JS原生实现响应式模态框演示！ 取消 确定 首先定义模态框的overlayer，然后定义模态框的内容包括head

在绑定 scroll 、resize 这类事件时，当它发生时，它被触发的频次非常高，间隔很近。如果事件中涉及到大量的位置计算、DOM 操作、元素重绘等工作且这些工作无法在下一个 scroll 事件触发前完成，就会造成浏览器掉帧。加之用户鼠标滚动往往是连续的，就会持续触发 scroll 事件导致掉帧扩大、浏览器 CPU 使用率增加、用户体验受到影响。一、页面渲染用户 scroll 和 res

使用require.js的目的：（1）实现js文件的异步加载，避免网页失去响应；（2）管理模块之间的依赖性，便于代码的编写和维护。一、require.js的加载1.加载require.js（两种方法）：（1）将放在网页底部加载（2）<script src="js/require.js"defer async="true" >实现异步加载2.加载自己代码（main.j

一、单体模式概念：单体模式是一个用来划分命名空间并将一批相关的属性和方法组织在一起的对象，如果他可以被实例化，那么他只能被实例化一次。优点：1. 可以来划分命名空间，从而清除全局变量所带来的危险。2. 利用分支技术来来封装浏览器之间的差异。3. 可以把代码组织的更为一体，便于阅读和维护。实例：var singleton = function( fn ){ var

1. promise异步编程promise对象代表一个异步操作，有三种状态：pending（进行中），fulfilled(resolved)（已成功），rejected（已失败）。特点：对象的状态不受外界影响一旦状态改变，就不会再变，任何时候都可以得到这个结果注: promise状态改变只有两种可能：pending —> fulfilled, pending —> ...

一、校验数字的表达式数字：^[0-9]*$ n位的数字：^\d{n}$ 至少n位的数字：^\d{n,}$ m-n位的数字：^\d{m,n}$ 零和非零开头的数字：^(0|[1-9][0-9]*)$ 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$ 带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$ 正数、负数、和小...

一、jQuery语法基础语法： $(selector).action()二、jQuery选择器元素选择器、#id选择器、.class选择器实例$("*")： 选取所有元素$(this)： 选取当前 HTML 元素$("p.intro")： 选取 class 为 intro 的 <p> 元素$("p:first")： 选取第一个 <p> 元素$("u...

正则表达式(Regular Expression)是一种文本模式，包括普通字符（例如，a 到 z 之间的字母）和特殊字符（称为"元字符"）。通过使用正则表达式，可以：测试字符串内的模式。例如，可以测试输入字符串，以查看字符串内是否出现电话号码模式或信用卡号码模式。这称为数据验证。 替换文本。可以使用正则表达式来识别文档中的特定文本，完全删除该文本或者用其他文本替换它。 基于模式匹...

转载自：阮一峰网络日志Mocha是现在最流行的JavaScript测试框架之一，在浏览器和Node环境都可以使用。所谓"测试框架"，就是运行测试的工具。通过它，可以为JavaScript应用添加测试，从而保证代码的质量。另外，除了Mocha以外，类似的测试框架还有Jasmine、Karma、Tape等，也很值得学习。一、安装第一步首先安装示例库Mocha-demos。...

Decorator 是 ES7 的一个新语法，目前仍处于第2阶段提案中，正如其“装饰器”的叫法所表达的，他通过添加@方法名可以对一些对象进行装饰包装然后返回一个被包装过的对象，可以装饰的对象包括：类，属性，方法等。在使用它之前需要引入babel模块 transform-decorators-legacy 编译成 ES5 或 ES6。1. 类的装饰当装饰的对象是类时，我们操作的就是这个类本...

AJAX意为异步的 JavaScript 和 XML，最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。一、创建 XMLHttpRequest 对象var xmlhttp;if (window.XMLHttpRequest){// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码xmlhttp=new

JSON是一种表示结构化数据的格式。一、语法JSON的语法可以表示以下三种类型的值：简单值：使用与JavaScript相同的语法，可以在JSON中表示字符串、数值、布尔值和null。但JSON不支持JavaScript中的特殊值undefined。对象：对象作为一种复杂数据类型，表示的是一组无序的键值对儿。而每个键值对儿中的值可以是简单值，也可以是复杂数据类型的值。数组：数组也

浏览器对象模型（BOM）以window对象为依托，表示浏览器窗口以及页面可见区域。一、window对象BOM的核心对象是window，它表示浏览器的一个实例。1.全局作用域由于window对象同时扮演着ES中Global对象的角色，因此所有在全局作用域中声明的变量、函数都会变成window对象的属性和方法。2.窗口关系及框架在使用框架时，每个框架都有自己的window对象以

DOM（文档对象模型）是用于访问和操作HTML和XML文档的API，DOM1级将HTML和XML文档形象的看作一个层次化的节点树，可以使用JavaScript来操作这个节点树，进而改变底层文档的外观和结构。一、节点层次以下面的HTML为例： Sample Page Hello World! 它对应的DOM层次结构为：1.Node类型除了IE之外，Ja

一、JavaScript简介JavaScript是一种专为与网页交互而设计的脚本语言，由下列三个不同的部分组成。（1）ECMAScript，由ECMA-262定义，提供核心语言功能；（2）文档对象模型（DOM），提供访问和操作网页内容的方法和接口；（3）浏览器对象模型（BOM），提供与浏览器交互的方法和接口。二、在HTML中使用JavaScript使用元素可以把JavaSc

一、基本类型与引用类型的值JavaScript可以保存两种类型的变量：基本类型值：指简单的数据段；引用类型值：指那些由多个值构成的对象；两者具有以下特点：1.基本类型值是按值访问的，而引用类型值是按引用访问的；2.基本类型值在内存中占据固定大小的空间，因此被保存在栈内存中；3.引用类型的值是对象，保存在堆内存中；4.包含引用类型值的变量实际上包含的并不是对象本身，而

引用类型有时候也被称为对象定义，因为它们描述的是一类对象所具有的属性和方法。一、object类型Object类型是一个基础类型，其他所有类型都从Object继承了基本的行为。1.创建Object实例的方式：（1）使用new操作符后跟Object构造函数var person = new Object();person.name = 'Nicholas';person.ag

接上篇：JavaScript高级程序设计--引用类型（上）四、RegExp类型RegExp类型是ECMAScript支持正则表达式的一个接口，提供了最基本的和一些高级的正则表达式功能。var expression = / pattern /flags;//创建一个正则表达式其中，pattern是任何简单或复杂的正则表达式。flags用以标明正则表达式的行为，它支持三个标志

JavaScript 知识总结

1

接上篇：面向对象的程序设计（上）三、继承JavaScript主要通过原型链实现继承。1.原型链原型链的构建是通过将一个类型的实例赋值给另一个构造函数的原型实现的。这样，子类型就能够访问超类型的所有属性和方法。function SuperType(){ this.property = true;}SuperType.prototype.getSuperValue = fun

定义函数的方式有两种：一种是函数声明，另一种是函数表达式。//函数声明function functionName(arg0, arg1, arg2){ //函数体}//函数表达式（匿名函数）var functionName = function(arg0, arg1, arg2){ //函数体}注意：函数声明有一个函数声明提升的特性，而函数表达式没有。一、递归我们知道对于

DOM1级主要定义的是HTML和XML文档的底层结构。DOM2 和DOM3 级则在这个结构的基础上引入了更多的交互能力，也支持了更高级的XML特性。为此，DOM2 和 DOM3 级分为许多模块，这些模块如下：DOM2级核心 (Core): 在1级核心基础上构建，为节点添加了更多方法和属性；DOM2级视图 (Views): 为文档定义了基于样式信息的不同视图；DOM2级事件 (Event

一、表单的基本知识在HTML中，表单是由 元素来表示的，而在 JavaScript 中，表单对应的则是 HTMLFormElement 类型。HTMLFormElement 具有它自己独有的属性和方法：acceptCharset: 服务器能够处理的字符集；等价于 HTML 中的 accept-charset 特性。action: 接受请求的 URL；等价于 HTML 中的 a

JavaScript 与 HTML 之间的交互是通过事件实现的。一、事件流事件流描述的是从页面中接收事件的顺序。IE的事件流是事件冒泡流，而Netscape Communicator 的事件流是事件捕获流。（1）事件冒泡IE 的事件流叫做事件冒泡，即事件开始时由最具体的元素 (文档中嵌套层次最深的那个节点) 接收，然后逐级向上传播到较为不具体的节点(文档)。比如单击了页

一、浏览器报告的错误1. IEIE是唯一一个在浏览器的界面窗体中显示JavaScript错误信息的浏览器。让错误对话框一发生错误就显示出来："Tools"(工具)--"Internet Options"(Internet 选项)--"Advanced"(高级)--选中"Display a notification about every script error"(显示每个脚本错误的通

由于浏览器间存在差别，通常需要根据不同浏览器的能力分别编写不同的代码，而针对客户端检测方法最常用的有以下几种：一、能力检测能力检测的目标不是识别特定的浏览器，而是识别浏览器的能力。比如，脚本在调用某个函数之前，可能要先检测该函数是否存在。能力检测的基本模式：if (object.propertyInQuestion){ //使用onject.propertyInQuestion