diff --git a/Database/MongoDB/增删查改.md b/Database/MongoDB/增删查改.md new file mode 100644 index 00000000..4f7df54d --- /dev/null +++ b/Database/MongoDB/增删查改.md @@ -0,0 +1,55 @@ +## 1 常用命令行 + +show dbs显示数据库列表 + +show collections + + +use dbname创建并切换db + + +db.user.insert({josnstr})向数据表中插入数据 + +db.user.find()搜索数据表 + +db.user.drop()删除数据表 + +db.dropDatabase()删除数据库 + +## 2 常用查找命令 + +### 非条件查找 + +### 单条件查找 + +### 多条件查找and + +### 正则表达式查找 + +### 查找结果过滤 + +### 查找结果排序 +.sort() + +### 查询前五条数据 +.limit(5) + +### 查询10条以后的数据 +skip(10) + +### 查询计数 + +.count() + +### 或查询 +.find({$or:{"name":"zhangsan","age":34}}) + + + +## 3 修改数据 + +db.uer.update({{"age":34},{$set:{"age":50}},multr:true}) + + +## 4 remove +db.user.remove({age:234}) \ No newline at end of file diff --git a/Database/MongoDB/聚合管道.md b/Database/MongoDB/聚合管道.md new file mode 100644 index 00000000..3e1b0e48 --- /dev/null +++ b/Database/MongoDB/聚合管道.md @@ -0,0 +1,18 @@ +表的关联查询和聚合统计 + + +## 常用操作符 + +$project 制定显示的列 + +$match 条件匹配 + +$limit 限制结果的数量 + +$skip 跳过文档的数量 + +$sort 条件排序 + +$group 条件组合结果 + +$lookup 引入其他集合的数据 \ No newline at end of file diff --git a/Database/MongoDB/设置索引.md b/Database/MongoDB/设置索引.md new file mode 100644 index 00000000..f15a0ebf --- /dev/null +++ b/Database/MongoDB/设置索引.md @@ -0,0 +1,24 @@ +## 创建索引的命名 + + + +db.user.ensureIndex({"tablenanme":1}) +### 获取索引 +db.user.getIndexes() + + +### 删除索引 +db.user.dropIndex({}) + +### 复合索引 +多个条件组成层次索引 + + +### 唯一索引 +(字段不能重复) + +## 获取执行时间 + +db.tablename.find().explain("executionStats") + + diff --git a/JavaScript/10chrome控制台.md b/JavaScript/10chrome控制台.md new file mode 100644 index 00000000..85f14594 --- /dev/null +++ b/JavaScript/10chrome控制台.md @@ -0,0 +1,19 @@ +### Elements + +渲染完成的页面布局。包括HTML元素和布局分析。 + +### Console + +javascript控制台。可以对网页进行操作。可以模拟客户端对服务器发送请求。 + +通过js向服务器发送请求,可以跳过前端js对请求数据的验证。 + +### Source +从服务器端下载的所有文件。包括JS、CSS、HTML以及各种依赖。 + +### Network +记录了请求的过程。包括所有类型的Request和Response以及其相关分析。 + +### Application + +主要是应用数据分析。包括储存在本地Chrome自带数据库中的各种数据。本地缓存、cookies、session \ No newline at end of file diff --git a/JavaScript/JavaScript数据类型.md b/JavaScript/1JavaScript数据类型.md similarity index 67% rename from JavaScript/JavaScript数据类型.md rename to JavaScript/1JavaScript数据类型.md index 36530412..7990be07 100644 --- a/JavaScript/JavaScript数据类型.md +++ b/JavaScript/1JavaScript数据类型.md @@ -77,14 +77,14 @@ ll o`;//反引号多行字符串 ``` -### 数组(列表) +### 数组array(列表list,集合set) ``` [1,2,3.14,'hello',null,true]; new Array(1,2,3); var arr =[1,2,3.14,'hello',null,true]; arr[0]; ``` -### 对象(字典,集合,键值对) +### 对象object(Dictionary字典,map映射) ``` var person ={ @@ -94,12 +94,24 @@ var person ={ zipcode:null }; ``` -### 变量 + +## 4 数据形式 +### 变量定义var ``` var a;//不强调类型 var b = 1; ``` +### 常量定义const + +const来定义常量 +``` +const PI = 3.14; +PI = 3; // 某些浏览器不报错,但是无效果! +PI; // 3.14 +``` + + ## 4 字符串 ### 模板字符串 @@ -127,7 +139,7 @@ s.indexOf('lo');//字符串首次出现的位置。 s.substring(0,5);//字字符串 ``` -## 数组 +## 5 数组 ### 数组访问与修改 ``` @@ -205,4 +217,80 @@ delete xiaoming.school; // 删除一个不存在的school属性也不会报错 + - * / %;//基本运算符 > < >= <= ==(强制类型转换) ===(包括类型);//比较运算符 ! && || ;//逻辑运算符 -``` \ No newline at end of file +& | ~ ^ << >> >>>//位运算符 +typeof//变量类型运算符 +instanceof//对象类型运算符 +``` + +## 8 Map映射 +### 创建map + +``` +var m = new Map([['Michael', 95], ['Bob', 75], ['Tracy', 85]]); +m.get('Michael'); +``` + +### map使用 +``` +var m = new Map(); // 空Map +m.set('Adam', 67); // 添加新的key-value +m.set('Bob', 59); +m.has('Adam'); // 是否存在key 'Adam': true +m.get('Adam'); // 67 +m.delete('Adam'); // 删除key 'Adam' +m.get('Adam'); // undefined +``` + +## 9 Set集合 + +### 创建Set +单值,值不能重复 +``` +var s1 = new Set(); // 空Set +var s2 = new Set([1, 2, 3]); // 含1, 2, 3 +``` + +### 使用Set + +``` +s.add(4); +s.delete(3); +``` + +## 10 iterable循环类型 + +array、map、Set、object都可以通过for of进行循环。但array本身也是对象,也是可以添加新的属性的。 + +### for-of +``` +var a = ['A', 'B', 'C']; +var s = new Set(['A', 'B', 'C']); +var m = new Map([[1, 'x'], [2, 'y'], [3, 'z']]); +for (var x of a) { // 遍历Array + console.log(x); +} +for (var x of s) { // 遍历Set + console.log(x); +} +for (var x of m) { // 遍历Map + console.log(x[0] + '=' + x[1]); +} +``` +### foreach + +接收一个函数,每次迭代就自动回调该函数 +``` +var s = new Set(['A', 'B', 'C']); +s.forEach(function (element, sameElement, set) { + console.log(element); +}); +``` + + +> 区别复合数据类型 +> * Array 数组,有顺序的单值,单值可重复。 +> * Set 集合,无顺序的单值,值不可以重复。 +> * object对象,无顺序的键值对,键必须是字符串。 +> * Map映射,无顺序的键值对,键可以是任意类型。 +> * iterable,加在其他类型上的特殊方法。 + diff --git a/JavaScript/2JavaScript程序结构.md b/JavaScript/2JavaScript程序结构.md new file mode 100644 index 00000000..cd9c01d1 --- /dev/null +++ b/JavaScript/2JavaScript程序结构.md @@ -0,0 +1,133 @@ +## 1 条件判断 + +### if-else +``` +var age = 20; +if (age >= 18) { // 如果age >= 18为true,则执行if语句块 + alert('adult'); +} else { // 否则执行else语句块 + alert('teenager'); +} +//else是可选的 +//如果语句块只有一句话,可以省略大括号。 +``` + +### if-else可以嵌套 + +``` +var age = 3; +if (age >= 18) { + alert('adult'); +} else { + if (age >= 6) { + alert('teenager'); + } else { + alert('kid'); + } +} + +if (age >= 6) { + console.log('teenager'); +} else if (age >= 18) { + console.log('adult'); +} else { + console.log('kid'); +} +``` + +## 2 循环 + + +### for循环 + +``` +var x = 0; +var i; +for (i=1; i<=10000; i++) { + x = x + i; +} +``` + +### for-in循环 + +可以循环数组(列表)和对象(字典) + +``` +var o = { + name: 'Jack', + age: 20, + city: 'Beijing' +}; +for (var key in o) { + console.log(key); // 'name', 'age', 'city' +} + +var a = ['A', 'B', 'C']; +for (var i in a) { + console.log(i); // '0', '1', '2' + console.log(a[i]); // 'A', 'B', 'C' +} +``` + +### while循环 + +条件循环 + +``` +var x = 0; +var n = 99; +while (n > 0) { + x = x + n; + n = n - 2; +} +``` + +### do-while循环 + +``` +var n = 0; +do { + n = n + 1; +} while (n < 100); +n; // 100 +``` + +### foreach循环 + +### for-of循环 + +### break语句 +“跳出”循环。 + +``` +for (i = 0; i < 10; i++) { + if (i === 3) { break; } + text += "数字是 " + i + "
"; +} +``` +### continue语句 + +“跳过”循环中的一个迭代。 + +``` +for (i = 0; i < 10; i++) { + if (i === 3) { continue; } + text += "数字是 " + i + "
"; +} +``` +## 3 条件选择 + +### switch +Switch case 使用严格比较(===)。 +``` +switch(表达式) { + case n: + 代码块 + break; + case n: + 代码块 + break; + default: + 默认代码块 +} +``` \ No newline at end of file diff --git a/JavaScript/3JavaScript函数.md b/JavaScript/3JavaScript函数.md new file mode 100644 index 00000000..0fb09e3f --- /dev/null +++ b/JavaScript/3JavaScript函数.md @@ -0,0 +1,301 @@ +## 1 定义函数 + +### 函数 +```JavaScript +function abs(x) { + if (x >= 0) { + return x; + } else { + return -x; + } +} + +var abs = function (x) { + if (x >= 0) { + return x; + } else { + return -x; + } +}; + +abs(10); +``` + +JavaScript的函数允许传入过多的参数或者过少的参数,也不会影响函数的执行。 + +### 函数的属性arguments +> 因为javascript中,函数也被看做对象,所以能给变量赋值。也能有函数的属性。 + +只在函数内部起作用,并且永远指向当前函数的调用者传入的所有参数 + +``` +function foo(x) { + console.log('x = ' + x); // 10 + for (var i=0; i x*x + +(x, y) => x * x + y * y + +// 无参数: +() => 3.14 + +// 可变参数: +(x, y, ...rest) => { + var i, sum = x + y; + for (i=0; i new Date().getFullYear() - this.birth; // this指向obj对象 + return fn(); + } +}; +obj.getAge();//25 +``` + +## 6 generator函数 + +### generator函数定义 + +``` +function* foo(x) { + yield x + 1; + yield x + 2; + return x + 3; +} +``` +### generator函数调用 +``` +function* fib(max) { + var + t, + a = 0, + b = 1, + n = 0; + while (n < max) { + yield a; + [a, b] = [b, a + b]; + n ++; + } + return; +} +``` + +直接调用调用,仅仅创建了一个generator对象,没有执行函数。不断调用next()方法,可以执行generator函数执行。每次遇到yield返回一次。 +``` +var f = fib(5);//一个generator对象 +f.next(); // {value: 0, done: false} +f.next(); // {value: 1, done: false} +f.next(); // {value: 1, done: false} +f.next(); // {value: 2, done: false} +f.next(); // {value: 3, done: false} +f.next(); // {value: undefined, done: true} +``` + +利用for of方法访问generator对象。 + +``` +for (var x of fib(10)) { + console.log(x); // 依次输出0, 1, 1, 2, 3, ... +} +``` + +### 特点 +因为generator可以在执行过程中多次返回,所以它看上去就像一个可以记住执行状态的函数,利用这一点,写一个generator就可以实现需要用面向对象才能实现的功能。 + +generator还有另一个巨大的好处,就是把异步回调代码变成“同步”代码。 + + +简单来说,就是一个局部状态变量。 + + + +## 7 装饰器 + +> (java中称为注解,Python也称为装饰器) + +因为JavaScript是脚本语言所有的对象、变量都是动态的。可以随时解绑。可以利用重新绑定的方法,修改原来的函数,为原来的函数添加装饰器。 +``` +//统计函数的执行次数 +var count = 0; +var oldParseInt = parseInt; // 保存原函数 + +window.parseInt = function () { + count += 1; + return oldParseInt.apply(null, arguments); // 调用原函数 +}; +``` + + + + diff --git a/JavaScript/4JavaScript高阶函数.md b/JavaScript/4JavaScript高阶函数.md new file mode 100644 index 00000000..69290c55 --- /dev/null +++ b/JavaScript/4JavaScript高阶函数.md @@ -0,0 +1,208 @@ +## 1 高阶函数定义 + +JavaScript的函数其实都指向某个变量。既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数。 + +``` +function add(x, y, f) { + return f(x) + f(y); +} + +x = -5; +y = 6; +f = Math.abs; +f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11; +return 11; +``` + +## 2 MapReduce + +map:对集合分割运算。 +reduce:对分割运算的结果进行聚合。 + +### array.map +map()方法本身可以接受一个函数,作用在数组的每一个元素,并拼接成新的数组。是一个高阶函数。 + + +``` +function pow(x) { + return x * x; +} +var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; +var results = arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81] +console.log(results); + +var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; +arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9'] +``` + +### array.reduce + +再看reduce的用法。Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,其效果就是: +``` +[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4) +``` + +``` +var arr = [1, 3, 5, 7, 9]; +arr.reduce(function (x, y) { + return x + y; +}); // 25 +``` + +## 3 filter + +### 过滤元素 +把Array的某些元素过滤掉,然后返回剩下的元素 + +Array的filter()也接收一个函数。filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。 + +``` +var arr = [1, 2, 4, 5, 6, 9, 10, 15]; +var r = arr.filter(function (x) { + return x % 2 !== 0; +}); +r; // [1, 5, 9, 15] +``` + +### 回调函数 +filter()接收的回调函数,其实可以有多个参数。通常我们仅使用第一个参数,表示Array的某个元素。回调函数还可以接收另外两个参数,表示元素的位置和数组本身: + +``` +var arr = ['A', 'B', 'C']; +var r = arr.filter(function (element, index, self) { + console.log(element); // 依次打印'A', 'B', 'C' + console.log(index); // 依次打印0, 1, 2 + console.log(self); // self就是变量arr + return true; +}); +``` + +利用回调函数,除掉重复元素 + +``` + +var r,arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry']; +r = arr.filter(function (element, index, self) { + return self.indexOf(element) === index; +}); + +``` + +## 4 sort + +默认把所有的元素转换为String进行排序。可以接受比较函数进行排序。 +``` +arr.sort(function (x, y) { + if (x < y) { + return -1; + } + if (x > y) { + return 1; + } + return 0; +}); +console.log(arr); // [1, 2, 10, 20] +``` +## 5 every +every()方法可以判断数组的所有元素是否满足测试条件。 + +``` +var arr = ['Apple', 'pear', 'orange']; +console.log(arr.every(function (s) { + return s.length > 0; +})); // true, 因为每个元素都满足s.length>0 + +console.log(arr.every(function (s) { + return s.toLowerCase() === s; +})); // false, 因为不是每个元素都全部是小写 +``` +## 6 find +find()方法用于查找符合条件的第一个元素,如果找到了,返回这个元素,否则,返回undefined + +``` +var arr = ['Apple', 'pear', 'orange']; +console.log(arr.find(function (s) { + return s.toLowerCase() === s; +})); // 'pear', 因为pear全部是小写 + +console.log(arr.find(function (s) { + return s.toUpperCase() === s; +})); // undefined, 因为没有全部是大写的元素 +``` + +## 7 findIndex +findIndex()和find()类似,也是查找符合条件的第一个元素,不同之处在于findIndex()会返回这个元素的索引,如果没有找到,返回-1: + +``` +var arr = ['Apple', 'pear', 'orange']; +console.log(arr.findIndex(function (s) { + return s.toLowerCase() === s; +})); // 1, 因为'pear'的索引是1 + +console.log(arr.findIndex(function (s) { + return s.toUpperCase() === s; +})); // -1 +``` + +## 8 forEach +forEach()和map()类似,它也把每个元素依次作用于传入的函数,但不会返回新的数组。forEach()常用于遍历数组,因此,传入的函数不需要返回值: + + +``` +var arr = ['Apple', 'pear', 'orange']; +arr.forEach(console.log); // 依次打印每个元素 +``` + +## 9 闭包 +> 闭包的出现,可以获取函数内部的变量且变量一直在内存当中.最简单的理解,一个作用域使用了另一个作用域中的变量。比如外层函数通过传参的方式,把某个变量传递给内层函数,就产生了闭包 +> +### 函数可以作为返回值实现惰性求值 +高阶函数除了可以接受函数作为参数外,还可以把函数作为结果值返回。 + +可以通过函数作为返回值,实现懒求值。 + +``` +function lazy_sum(arr) { + var sum = function () { + return arr.reduce(function (x, y) { + return x + y; + }); + } + return sum; +} + +//调用函数f时,才真正计算求和的结果: + +f(); // 15 +``` + +### 函数作为返回值实现循环惰性求值 +> 感觉与Python的生成器yield惰性求值很像,这里介绍了其根本的原理。 + + +``` +function count() { + var arr = []; + for (var i=1; i<=3; i++) { + arr.push((function (n) { + return function () { + return n * n; + } + })(i)); + } + return arr; +} + +var results = count(); +var f1 = results[0]; +var f2 = results[1]; +var f3 = results[2]; + +f1(); // 1 +f2(); // 4 +f3(); // 9 +``` + +## 10 回调函数与多线程异步通信 + +回调函数就是一个函数,它是在我们启动一个异步任务的时候就告诉它:等你完成了这个任务之后要干什么。这样一来主线程几乎不用关心异步任务的状态了,他自己会善始善终。 \ No newline at end of file diff --git a/JavaScript/5JavaScript异常处理.md b/JavaScript/5JavaScript异常处理.md new file mode 100644 index 00000000..5f535cbc --- /dev/null +++ b/JavaScript/5JavaScript异常处理.md @@ -0,0 +1,22 @@ +## 1 异常处理语句 + + +try 语句使您能够测试代码块中的错误。 + +catch 语句允许您处理错误。 + +throw 语句允许您创建自定义错误。 + +finally 使您能够执行代码,在 try 和 catch 之后,无论结果如何。 + +``` +try { + 供测试的代码块 +} + catch(err) { + 处理错误的代码块 +} +finally { + 无论 try / catch 结果如何都执行的代码块 +} +``` \ No newline at end of file diff --git a/JavaScript/6JavaScript对象.md b/JavaScript/6JavaScript对象.md new file mode 100644 index 00000000..745849e6 --- /dev/null +++ b/JavaScript/6JavaScript对象.md @@ -0,0 +1,148 @@ +## 1 对象定义 + +* 在JavaScript中所有事物都是对象。 +* 对象也是一个变量,可以包含任意值。`var car = {type:"Fiat", model:500, color:"white"};` + +## 2 对象属性 + +### 定义 +* 键值对 + +### 访问 + +* person.lastName +* person["lastName"] + + +## 3 对象方法 + + +### 对象绑定的函数称为方法 + +``` +var xiaoming = { + name: '小明', + birth: 1990, + age: function () { + var y = new Date().getFullYear(); + return y - this.birth; + } +}; + +xiaoming.age; // function xiaoming.age() +xiaoming.age(); // 今年调用是25,明年调用就变成26了 +``` + +### this变量 + +* this指针一直指向当前的对象。 +* 如果是全局对象,this指向window +* this指向的具体位置,视调用者不同而改变。 + +``` +function getAge() { + var y = new Date().getFullYear(); + return y - this.birth; +} + +var xiaoming = { + name: '小明', + birth: 1990, + age: getAge +}; + +xiaoming.age(); // 25, 正常结果,this指向小明。 +getAge(); // NaN,this指向window +``` +* 对象的方法中的嵌套方法,this指向不明确(window)。所以,如果在子作用域调用本作用域的内容,定义that进行指针传递。 +``` +var xiaoming = { + name: '小明', + birth: 1990, + age: function () { + var that = this; // 在方法内部一开始就捕获this + function getAgeFromBirth() { + var y = new Date().getFullYear(); + return y - that.birth; // 用that而不是this + } + return getAgeFromBirth(); + } +}; + +xiaoming.age(); // 25 +``` + +### apply() +使用函数的apply属性,重新定义this指针的指向。 + +即,将函数应用到某个对象上。 + +函数本身的apply方法,它接收两个参数,第一个参数就是需要绑定的this变量,第二个参数是Array,表示函数本身的参数。 + +``` +function getAge() { + var y = new Date().getFullYear(); + return y - this.birth; +} + +var xiaoming = { + name: '小明', + birth: 1990, + age: getAge +}; + +xiaoming.age(); // 25 +getAge.apply(xiaoming, []); // 25, this指向xiaoming, 参数为空 +``` + +### call() + +使用函数的call属性,同样可以定义this指针的具体指向。 + +与apply()类似的方法,唯一区别是apply()把参数打包成Array再传入;call()把参数按顺序传入。 + +比如调用Math.max(3, 5, 4),分别用apply()和call()实现如下: + +``` +Math.max.apply(null, [3, 5, 4]); // 5 +Math.max.call(null, 3, 5, 4); // 5 +``` + +## 4 new运算符 + +### 实例 +new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。 + +``` +function Car(make, model, year) { + this.make = make; + this.model = model; + this.year = year; +} + +const car1 = new Car('Eagle', 'Talon TSi', 1993); + +console.log(car1.make); +// expected output: "Eagle" +``` + +### 语法 + +``` +new constructor([arguments]) +``` + +### 原理 + +1. 创建一个空的简单JavaScript对象(即{}); +2. 链接该对象(即设置该对象的构造函数)到另一个对象 ; +3. 将步骤1新创建的对象作为this的上下文 ; +4. 如果该函数没有返回对象,则返回this。 + + +### 步骤 + +创建一个用户自定义的对象需要两步: + +1. 通过编写函数来定义对象类型。 +2. 通过 new 来创建对象实例。 \ No newline at end of file diff --git a/JavaScript/7JavaScript内建对象.md b/JavaScript/7JavaScript内建对象.md new file mode 100644 index 00000000..2b784f37 --- /dev/null +++ b/JavaScript/7JavaScript内建对象.md @@ -0,0 +1,127 @@ +# JavaScrip对象 +## 0 对象 + +### typeof +在JavaScript一切皆对象。 + +使用typeof运算符获取对象类型。返回对象类型。 + +### 包装对象 + +将基本类型转换为对象类型。 +``` +var n = new Number(123); // 123,生成了新的包装类型 +var b = new Boolean(true); // true,生成了新的包装类型 +var s = new String('str'); // 'str',生成了新的包装类型 +``` +## 1 JavaScript内建对象 + +### Array对象 + +Array 对象用于在变量中存储多个值 +### Boolean对象 + +Boolean 对象用于转换一个不是 Boolean 类型的值转换为 Boolean 类型值 (true 或者false). +### Date对象 + +Date 对象用于处理日期与时间。 +### Math对象 + +Math 对象用于执行数学任务。 +### Number对象 +原始数值的包装对象 +### String对象 + +处理文本字符串 +### RegExp对象 + +正则表达式字符串的处理 +### 全局属性、函数 + +encode、decode系列 +数据类型转换系列 +### Error对象 +在错误发生时,提供了错误的提示信息。 + +## 2 Browser对象 + +### window对象 + +表示浏览器打开的窗口。是默认的全局对象。默认绑定了alert等方法。 + +### Navigator对象 + +包含浏览器相关的信息。 + +### Screen对象 + +客户端显示屏相关的信息。 +### History对象 + +包含用户在浏览器中访问过的URL。是window对象的一部分。 + +### Location对象 + +包含当前的URL信息。是window对象的一部分。 +### 存储对象 + +webAPI提供了sessionStorage(会话存储)和localStorage(本地存储)两个对象来对网页的数据进行增删查改操作。 + +localStorage 用于长久保存整个网站的数据,保存的数据没有过期时间,直到手动去除。 + +sessionStorage 用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据。 + + +## 3 DOM对象 + +* 文档是一个文档节点 +* 所有的HTML元素是元素节点 +* 所有的HTML属性是属性节点 +* 文本插入到HTML元素是文本节点 +* 注释是注释节点。 +### DOM Document对象 + +当浏览器载入 HTML 文档, 它就会成为 Document 对象。 + +Document 对象是 HTML 文档的根节点。 + +Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。 + +Document 对象是 Window 对象的一部分,可通过 window.document 属性对其进行访问 +### DOM元素对象 + +元素对象代表着一个 HTML 元素。 + +元素对象 的 子节点可以是, 可以是元素节点,文本节点,注释节点。 + +NodeList 对象 代表了节点列表,类似于 HTML元素的子节点集合。 + +元素可以有属性。属性属于属性节点(查看下一章节)。 +### DOM属性对象 + +在 HTML DOM 中, Attr 对象 代表一个 HTML 属性。 + +HTML属性总是属于HTML元素。 + +在 HTML DOM 中, the NamedNodeMap 对象 表示一个无顺序的节点列表。 + +我们可通过节点名称来访问 NamedNodeMap 中的节点。 + +### DOM事件对象 + +HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序。 + +事件通常与函数结合使用,函数不会在事件发生前被执行! (如用户点击按钮)。 + +### DOMConsole对象 + +Console 对象提供了访问浏览器调试模式的信息到控制台。 + + +### CSS Style Declaration对象 + +CSSStyleDeclaration 对象表示一个 CSS 属性-值(property-value)对的集合。 +### DOMHTMLCollection +HTMLCollection 是 HTML 元素的集合。 + +HTMLCollection 对象类似一个包含 HTML 元素的数组列表。 diff --git a/JavaScript/8JavaScript事件响应.md b/JavaScript/8JavaScript事件响应.md new file mode 100644 index 00000000..995ef22e --- /dev/null +++ b/JavaScript/8JavaScript事件响应.md @@ -0,0 +1,85 @@ +## 1 常见事件 + +> 本质上也是一种异步通信的方式。基于回调的异步通信,和基于事件响应机制的异步通信。 + +### 鼠标事件 + +* onclick 用户点击了 HTML 元素 +* ondblclick 当用户双击某个对象时调用的事件句柄 +* onmousedown 鼠标按钮被按下。 +* onmouseenter 当鼠标指针移动到元素上时触发。 +* onmouseleave 当鼠标指针移出元素时触发 +* onmousemove 鼠标被移动。 +* onmouseover 鼠标移到某元素之上。 +* onmouseout 鼠标从某元素移开。 +* onmouseup 鼠标按键被松开。 + + +### 键盘事件 + + +* onkeydown 用户按下键盘按键 +* onkeypress 某个键盘按键被按下并松开。 +* onkeyup 某个键盘按键被松开。 +### 框架对象事件 + +* onabort 图像的加载被中断。 ( ) 2 +* onbeforeunload 该事件在即将离开页面(刷新或关闭)时触发 2 +* onerror 在加载文档或图像时发生错误。 ( , 和 ) +* onhashchange 该事件在当前 URL 的锚部分发生修改时触发。 +* onload 一张页面或一幅图像完成加载。 2 +* onpageshow 该事件在用户访问页面时触发 +* onpagehide 该事件在用户离开当前网页跳转到另外一个页面时触发 +* onresize 窗口或框架被重新调整大小。 2 +* onscroll 当文档被滚动时发生的事件。 2 +* onunload 用户退出页面。 ( 和 ) + +### 表单事件 + +* onblur 元素失去焦点时触发 2 +* onchange 该事件在表单元素的内容改变时触发( , ,