HTML5学习小记十三

1. appendChild()方法的使用:
   作用是向节点末尾添加最后的一个子节点(或从一个元素移动到另外一个元素中);

var node=document.getElementById("myList2").lastChild;
document.getElementById("myList1").appendChild(node);
添加之前数据展示：
myList1:          Coffee
                        Tea

 myList2:         Water
                        Milk
添加之后数据展示：
myList1:          Coffee
                        Tea
                         Milk

 myList2:        Water

2.Object.values方法
该方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（ enumerable ）属性的键值。

var obj = { foo: "bar", baz: 42 };  
Object.values(obj)  
//返回 ["bar", 42]  

如果Object.values方法的参数是一个字符串，会返回各个字符组成的一个数组。

Object.values('tmp')  
// ['t', 'm', 'p']  

Object.entries 与Object.values获取到的值不同
该方法返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（ enumerable ）属性的键值对数组。(即获取到所有的键值)

var obj = { foo: "bar", baz: 42 };  
Object.values(obj)  
//返回 ["foo", baz]  

3. forEach()遍历数组的一种方式 与each()类似

var arr = [1,2,3,4];
arr.forEach(alert);

forEach()与each()的转换:

forEach(function(vale,i,ary){
 anything is ok 
});
此方法可以转化为:
$.each(function(i,value,ary){
 anything is ok 
})

4.push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
该方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject，而不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。

var ary = new Array(3)
ary[0] = "one"
ary[1] = "two"
ary[2] = "three"
document.write(ary + "<br />")
document.write(ary.push("two") + "<br />")
document.write(ary)

5.遍历之map()
该方法是把每个元素通过函数传递到当前匹配集合中，生成包含返回值的新的 jQuery 对象。

<form method="post" action="">
  <fieldset>
    <div>
      <label for="two">2</label>
      <input type="checkbox" value="2" id="two" name="number[]">
    </div>
    <div>
      <label for="four">4</label>
      <input type="checkbox" value="4" id="four" name="number[]">
    </div>
    <div>
      <label for="six">6</label>
      <input type="checkbox" value="6" id="six" name="number[]">
    </div>
    <div>
      <label for="eight">8</label>
      <input type="checkbox" value="8" id="eight" name="number[]">
    </div>
  </fieldset>
</form>
这个方法的返回结果是
$(':checkbox').map(function() {
  return this.id;
}).get().join(',');

http://www.w3school.com.cn/jquery/traversing_map.asp