JavaScript

更新DOM

修改innerHTML属性
修改innerText或textContent属性,这样可以自动对字符串进行HTML编码，保证无法设置任何HTML标签.

两者的区别在于读取属性时，innerText不返回隐藏元素的文本，而textContent返回所有文本。另外注意IE<9不支持textContent。

修改CSS也是经常需要的操作。DOM节点的style属性对应所有的CSS，可以直接获取或设置。因为CSS允许font-size这样的名称，但它并非JavaScript有效的属性名，所以需要在JavaScript中改写为驼峰式命名fontSize

插入DOM

若DOM节点为空，可直接使用innerHTML=''则可修改DOM节点内容，相当于插入了新的DOM
使用appendChild,把一个子节点添加到父节点的最后一个子节点。若该添加的子节点已经存在在当前文档树的话，该节点会首先从原来的位置删除，再插入到新位置。使用createElement()
insertBefore
parentElement.insertBefore(newElement, referenceElement);子节点会插入到referenceElement之前。

删除DOM

要删除一个节点，首先要获得该节点本身以及它的父节点，然后，调用父节点的removeChild把自己删掉
当你遍历一个父节点的子节点并进行删除操作时，要注意，children
属性是一个只读属性，并且它在子节点变化时会实时更新。

parent.removeChild(parent.children[0]);

操作表单

获取值
若获得了一个节点的引用，就可直接调用value获得对应的用户输入值。

// 
var input = document.getElementById('email');
input.value; // '用户输入的值'

这种方式可以应用于text、password、hidden以及select。但是，对于单选框和复选框，value属性返回的永远是HTML预设的值，而我们需要获得的实际是用户是否“勾上了”选项，所以应该用checked判断.

设置值
- 对于text、password、hidden以及select，直接设置value就可以。
- 对于单选框和复选框，设置checked为true或false即可。
提交表单

没有name属性的的数据不会被提交

File API(这一块还不怎么懂)

HTML5的File API提供了File和FileReader两个主要对象，可以获得文件信息并读取文件。

var fileInput = document.getElementById('test-image-file'), 
       info = document.getElementById('test-file-info'),
       preview = document.getElementById('test-image-preview');
// 监听change事件:
fileInput.addEventListener('change', function () { 
// 清除背景图片: 
    preview.style.backgroundImage = ''; 
// 检查文件是否选择:
     if (!fileInput.value) { info.innerHTML = '没有选择文件'; return; }
 // 获取File引用: 
    var file = fileInput.files[0]; 
// 获取File信息:
     info.innerHTML = '文件: ' + file.name + '
' + '大小: ' + file.size + '
' + '修改: ' + file.lastModifiedDate; 
    if (file.type !== 'image/jpeg' && file.type !== 'image/png' && file.type !== 'image/gif') {
        alert('不是有效的图片文件!'); return; } 
// 读取文件:
     var reader = new FileReader(); 
    reader.onload = function(e) { var data = e.target.result; 
// 'data:image/jpeg;base64,/9j/4AAQSk...(base64编码)...' 
    preview.style.backgroundImage = 'url(' + data + ')'; };
 // 以DataURL的形式读取文件:
     reader.readAsDataURL(file);
});

上面的代码演示了如何通过HTML5的File API读取文件内容。以DataURL的形式读取到的文件是一个字符串，类似于data:image/jpeg;base64,/9j/4AAQSk...(base64编码)...，常用于设置图像。如果需要服务器端处理，把字符串base64,后面的字符发送给服务器并用Base64解码就可以得到原始文件的二进制内容。

回调

在JavaScript中，浏览器的JavaScript执行引擎在执行JavaScript代码时，总是以单线程模式执行，也就是说，任何时候，JavaScript代码都不可能同时有多于1个线程在执行。
在JavaScript中，执行多任务实际上都是异步调用，比如上面的代码：

reader.readAsDataURL(file);

就会发起一个异步操作来读取文件内容。因为是异步操作，所以我们在JavaScript代码中就不知道什么时候操作结束，因此需要先设置一个回调函数：

reader.onload = function(e) { 
// 当文件读取完成后，自动调用此函数:
};

当文件读取完成后，JavaScript引擎将自动调用我们设置的回调函数。执行回调函数时，文件已经读取完毕，所以我们可以在回调函数内部安全地获得文件内容。

AJAX

注意：AJAX请求是异步执行的，也就是说，要通过回调函数获得响应。

用JavaScript请求外域（就是其他网站）的URL

一是通过Flash插件发送HTTP请求，这种方式可以绕过浏览器的安全限制，但必须安装Flash，并且跟Flash交互。不过Flash用起来麻烦，而且现在用得也越来越少了。
二是通过在同源域名下架设一个代理服务器来转发，JavaScript负责把请求发送到代理服务器
第三种方式称为JSONP，它有个限制，只能用GET请求，并且要求返回JavaScript。这种方式跨域实际上是利用了浏览器允许跨域引用JavaScript资源
CORS是HTML5规范定义的如何跨域访问资源

Origin表示本域，也就是浏览器当前页面的域。当JavaScript向外域（如sina.com）发起请求后，浏览器收到响应后，首先检查Access-Control-Allow-Origin
是否包含本域，如果是，则此次跨域请求成功，如果不是，则请求失败，JavaScript将无法获取到响应的任何数据。

假设本域是my.com，外域是sina.com，只要响应头Access-Control-Allow-Origin为http://my.com，或者是*，本次请求就可以成功。
可见，跨域能否成功，取决于对方服务器是否愿意给你设置一个正确的Access-Control-Allow-Origin，决定权始终在对方手中。