javascript 基础 ：用 document.body.childNodes.length获得空白页面body中子元素的个数
childNodes获取的节点包括文本节点和元素节点，body中没有任何内容，但是实际存在一个空的文本节点，所以document.body.childNodes.length就是1很正常，要获取只有元素子节点，请用children属性
javascript 基础 js类和原型到底是什么
其实简单来说，原型就是一个对象对另一个对象的引用。
然后其是怎么联系起来的呢，是通过prototype。对就是这个，给你一个例子
var obj = {
a: 2
}
var myObj = Object.create(obj);
console.log(myObj.a); // 2
console.log(myObj === obj); // false
console.log(Object.getPrototypeOf(myObj) === obj); // true
Object.getPrototypeOf(myObj).a = 4
console.log(obj.a); // 4
通过上面的例子，你可以看到，myObj的原型就是obj！然后obj的原型是哪个呢，是Object.prototype。实际上通过上面，你就能知道，原型原理上是对于另一个对象的引用，通过引用吧几个对象给串联起来调用。
那么你的第二个问题马上又来了，可能也是你关心的问题，类和原型的关系是啥呢？
实际上，类在实例化的时候，也就是通过new来创建一个对象的时候，是分为以下几步的：
创建一个全新的对象
这个新对象会被执行prototype连接
新对象绑定到函数调用的this
如果函数没有返回其他对象，那么new表达式中的函数调用会自动返回这个新对象
这个就是new实例化的时候，所做的一些步骤，那么你其中有几个需要注意的点：
如果有return并且返回的是一个对象的话，则直接返回return后的那个对象。
反之，则新建一个对象。
并且吧函数的prototype引用到新建对象的prototype中。
这个怎么理解呢？再给你一个例子，可能例子更直观一些：
var protoObj = {
b: 10
}
function Foo() {}
Foo.prototype = protoObj;
var a = new Foo();
console.log(Object.getPrototypeOf(a) === Foo.prototype); // true
console.log(Object.getPrototypeOf(a) === protoObj); // true
console.log(a.b); // 10
通过这个例子，你可以看出来，实际上类实例化的过程，其中有一项，就是把其构造好的对象的prototype和类的prototype做关联。因为做好了引用关联，所以构造好的对象可以使用原类里面的原型方法。
这个也讲完了，那么你可能会对class比较感兴趣，想知道class是怎么做的，实际上，class更多，我理解上就是上面类似于Foo()类的一种语法糖，当然也不仅仅是语法糖，但是大体原理是没啥区别的，所以，上面所说的，对于class也同样适用
好啦，如果你对原型和类实例化有更多想了解的，可以给你两篇文章，参考一下：
Javascript基础之-原型（prototype）
Javascript基础之-this
求问JavaScript
!DOCTYPE html
html
head
meta charset="UTF-8"
title动态创建HTML实践/title
style type="text/css"
.container{
width:800px;
margin:20px auto;
}
.all{
width:300px;
height: 450px;
border:1px solid blue;
float:left;
}
.selected{
width: 300px;
height: 450px;
border:1px solid green;
float:left;
margin-left:20px;
}
.input{
margin:10px;
font-size: 1.2em;
}
h1{
border-bottom:2px solid black;
}
ul{
padding:2px;
}
ul li{
list-style: none;
margin-top:4px;
margin-left:2px;
border:1px solid brown;
background-color: beige;
font-size:2em;
cursor: pointer;
}
/style
script
var map={},reg=/^\s+|\s+$/g;
onload=function(){
var lis=allFruits.getElementsByTagName("li");
for(var i=0;ilis.length;i++){
var li=lis[i];
li.onclick=function(){
if(this.parentElement!=selectedFruits){
selectedFruits.appendChild(this);
}else{
allFruits.appendChild(this);
}
}
map[li.innerHTML.replace(reg,"")]=1;
}
btnInput.onclick=function(){
var vv=fruitInput.value.replace(reg,"");
if(null==map[vv]){
var li=document.createElement("li");
li.onclick=function(){
if(this.parentElement!=selectedFruits){
selectedFruits.appendChild(this);
}else{
allFruits.appendChild(this);
}
}
li.innerHTML=vv;
allFruits.appendChild(li);
map[vv]=1;
}else{
alert("“" + vv + "”" + "已经存在 !");
}
}
}
/script
/head
body
div
div
label for="fruitInput" 输入新的水果：/label
input id="fruitInput" type="text" /
input id="btnInput" type="button" value="确认输入"/
/div
div
h1所有水果/h1
ul id="allFruits"
li苹果/li
li香蕉/li
li橘子/li
li葡萄/li
li柚子/li
li西瓜/li
li哈密瓜/li
/ul
/div
div
h1我喜欢的水果/h1
ul id="selectedFruits"/ul
/div
/div
/body
/html
如何正确学习JavaScript
JavaScript作为网站前端的核心知识是非常重要的，但是如何学习JavaScript是很多初学者面对的一个难题，下面我说一下个人对于如何学习JavaScript的一点心得，希望能帮到大家。
1、首先学习基础，尤其是JavaScript与其他语言不同的基础知识。
学习每个编程语言可能都要从基础的变量函数结构等学起，JavaScript相对于其他的编程语言在基础上有一些比较有特点的地方，这些东西是尤其需要我们注意的，比如说自调函数、比如说变量值为空不是null而是undefined的等，这些东西都是和主流的编程的语言如c++、java等是有区别的，所以想要学好JavaScript，这些基础的知识一定要把握好学习好才行。
2、关于学习JavaScript的进阶
JavaScript进阶知识更是有很多难理解的东西和不同于其他语言的东西，这些东西都是深入学习JavaScript的难点，简单的说一下JavaScript是基于对象的浏览器脚本语言，但是为了使JavaScript也能够支持面向对象编程，人们就使用了很多的方法来模拟面向对象的的特点，这些就变成了JavaScript的一些难点，比如说JavaScript的继承要借助原型、比如JavaScript的类需要使用构造函数来构造一个对象等，这些东西都是和其他支持面向对象的语言是不同的，所以就导致了一些难点。关于进阶学习JavaScript，还有JavaScript一些深入的知识需要去理解比如原型链和闭包、比如收函数的作用域执行流程和上下文，这些东西都是JavaScript比较深入的知识、
最后说明，JavaScript作为前端的核心语言绝对没有没有想象的那么简单，要想学好JavaScript除了以上提到的知识和注意点，还需要的就是多动手和实践，我们都知道网页上的所有特效都是借助JavaScript来实现，那么我们就需要在学习JavaScript的过程中多使用原生的JavaScript代码实现一些特效，当然学习使用jQuery等JavaScript类库进行开发也十分的重要，但是这绝对不能是取代我们学习JavaScript的方法。