JavaScript学习笔记-删除DOM元素
删除一个DOM节点就比插入要容易得多。要删除一个节点，首先要获得该节点本身以及它的父节点，然后，调用父节点的removeChild把自己删掉：
/ 拿到待删除节点:var self = document.getElementById('to-be-removed');// 拿到父节点:var parent = self.parentElement;// 删除:var removed = parent.removeChild(self);removed === self; // true
当你遍历一个父节点的子节点并进行删除操作时，要注意，children属性是一个只读属性，并且它在子节点变化时会实时更新
试验：
<!-- HTML结构 --><ul id="test-list"> <li>JavaScript</li> <li>Swift</li> <li>HTML</li> <li>ANSI C&l ...
JavaScript学习笔记-添加DOM元素
appenChild
insertBefore parentElement.insertBefore(newElement, referenceElement);
createElement
setAttribute
试验：
<!Doctype><html><head><meta charset="utf-8"></meta><title>js test</title><script>function change(id,is){ var js=document.getElementById(id); var ls=document.getElementById(is); ls.appendChild(js)}function append(){ var list=document.getElementById("list"); var haskell=document.createElement(' ...
JavaScript学习笔记-更改DOM元素
更新DOM修改节点的文本，方法有两种：
修改innerHTML属性这个方式非常强大，不但可以修改一个DOM节点的文本内容，还可以直接通过HTML片段修改DOM节点内部的子树：
// 获取<p id="p-id">...</p>var p = document.getElementById('p-id');// 设置文本为abc:p.innerHTML = 'ABC'; // <p id="p-id">ABC</p>// 设置HTML:p.innerHTML = 'ABC <span style="color:red">RED</span> XYZ';// <p>...</p>的内部结构已修改
修改innerText或textContent属性这样可以自动对字符串进行HTML编码，保证无法设置任何HTML标签：// 获取<p id="p-id&qu ...
JavaScript学习笔记-操作DOM
DOM 节点选择document.getElementById()document.getElementsByTagName()document.getElementsByClassName()
由于ID在HTML文档中是唯一的，所以document.getElementById()可以直接定位唯一的一个DOM节点。document.getElementsByTagName()和document.getElementsByClassName()总是返回一组DOM节点。要精确地选择DOM，可以先定位父节点，再从父节点开始选择，以缩小范围。
// 返回ID为'test'的节点：var test = document.getElementById('test');// 先定位ID为'test-table'的节点，再返回其内部所有tr节点：var trs = document.getElementById('test-table').getElementsByTagName('tr');// ...
JavaScript学习笔记- window对象
windowsget the inner size of browser:windows.innerWidthwindows.innerHeight
get the global size of browser:windows.outerWidthwindows.outerHeight
navigatorget information of browsernavigator.appName:浏览器名称；navigator.appVersion:浏览器版本；navigator.language:浏览器设置的语言；navigator.platform:操作系统类型；navigator.userAgent:浏览器设定的User-Agent字符串。
screenuse screen to get screen information:screen.width:screen.height:screen.colorDepth:
locationfor a url=http://www.example.com:8080/path/index.html?a=1&b=2#TOP
l ...
JavaScript学习笔记-Class(ES6)
之前的原型继承关系可以看出，JS在实现继承时还是很麻烦的，需要大量代码。但是，class出现了。
classclass从ES6开始正式被引入到JavaScript中,目的就是让定义类更简单。
先前的类方法：
function Student(name){ this.name=name;}Student.prototype.hello= function(){ alert("Hello, "+this.name); }
用class 构建：
class Student{ constructor(name){ this.name=name; } hello(){ alert('Hello, '+this.name); }}
实例化：
var xiaoming = new Student('小明');xiaoming.hello();
class继承利用class继承非常方便，直接通过 extends 来实现：
class ...
JavaScript学习笔记-Inherits
原型继承c++,python,java继承的本质是扩展一个已有的Class，并生成新的Subclass。JavaScript由于采用原型继承，我们无法直接扩展一个Class，因为根本不存在Class这种类型。
JavaScript 的原型继承实现方式：
定义新的构造函数，并在内部用 call() 调用希望“继承”的构造函数，并绑定 this ；
借助中间函数 F 实现原型链继承，最好通过封装的 inherits 函数完成；
继续在新的构造函数的原型上定义新方法。
inherits 方法构造function inherits(Child,Parent){ var F=function(){}; F.prototype=Parent.prototype; Child.prototype=new F(); Child.prototype.constructor=Child; }//实例function Student(props){ this.name=props.name || 'unnamed'; ...
JavaScript学习笔记-JSON
jsonJSON是JavaScript Object Notation的缩写，它是一种数据交换格式。2002年，雅虎的高级架构师道格拉斯·克罗克福特（Douglas Crockford）发明了JSON这种超轻量级的数据交换格式。
数据类型
number：和JavaScript的 number完全一致；
boolean：就是JavaScript的 true或 false；
string：就是JavaScript的 string；
null：就是JavaScript的 null；
array：就是JavaScript的Array表示方式——[]；
object：就是JavaScript的 { ... }表示方式。
and …
字符集必须是 UTF-8;
JSON 的字符串规定必须用双引号 ""，Object 的键也必须用双引号 ""。
序列化使用JSON.stringify()方法。把任何JavaScript对象变成JSON，就是把这个对象序列化成一个JSON格式的字符串，这样才能够通过网络传递给其他计算机。
var ...
JavaScript学习笔记-prototype
原型 prototypevar Student={ name:'robort', height:1.2, run:function(){ return console.log(this.name+" is running..."); } } var xm=Object.create(Student); xm.name='xiaoming' xm.name//"xiaoming" xm.run()//"xiaoming is running..." xm.height//1.2 xm.__proto__===Student; //true
构造prototype除了直接用{ … }创建一个对象外，JavaScript还可以用一种构造函数的方法来创建对象。它的用法是，先定义一个构造函数：
function Student(name,age){ this.name=name; this.age=age; this.hello=funct ...
JavaScript学习笔记-Regular Expression
JS 正则
\d 可以匹配一个数字
\w 可以匹配一个字母或数字
\s 可以匹配一个空格
. 可以匹配任意字符
* 表示任意个字符（包括 0 个）
+ 表示至少一个字符
? 表示 0 个或 1 个字符
{n} 表示 n 个字符
{n,m} 表示 n-m 个字符
[] 表示范围
[0-9a-zA-Z\_] 可以匹配一个数字、字母或者下划线
[0-9a-zA-Z\_]+ 可以匹配至少由一个数字、字母或者下划线组成的字符串，比如’a100’，’0_Z’，’js2015’等等；
[a-zA-Z\_\$][0-9a-zA-Z\_\$]* 可以匹配由字母或下划线、$开头，后接任意个由一个数字、字母或者下划线、$组成的字符串，也就是JavaScript允许的变量名；
[a-zA-Z\_\$][0-9a-zA-Z\_\$]{0, 19} 更精确地限制了变量的长度是1-20个字符（前面1个字符+后面最多19个字符）。
A|B可以匹配A或B，所以(J|j) ...
JavaScript学习笔记-变量作用域与解构赋值
变量作用域
如果一个变量在函数体内部申明，则该变量的作用域为整个函数体，在函数体外不可引用该变量;
如果两个不同的函数各自申明了同一个变量，那么该变量只在各自的函数体内起作用。换句话说，不同函数内部的同名变量互相独立，互不影响;
JavaScript的函数可以嵌套，此时，内部函数可以访问外部函数定义的变量，反过来则不行;
JavaScript的函数在查找变量时从自身函数定义开始，从“内”向“外”查找。如果内部函数定义了与外部函数重名的变量，则内部函数的变量将“屏蔽”外部函数的变量。
变量提升JavaScript的函数定义有个特点，它会先扫描整个函数体的语句，把所有申明的变量“提升”到函数顶部
'use strict';function foo() { var x = 'Hello, ' + y; alert(x); var y = 'Bob';}foo();
虽然是strict模式，但语句var x = ‘Hello, ‘ + y;并不报错，原因是变量y在稍后申明了。但 ...
