匹配键盘左右键。

document.addEventListener("keydown",keydown);
//键盘监听，注意：在非ie浏览器和非ie内核的浏览器
//参数1：表示事件，keydown:键盘向下按；参数2：表示要触发的事件
function keydown(event){
    //表示键盘监听所触发的事件，同时传递参数event
    switch(event.keyCode){
        case 37:
            alert("左键");
            break;
        case 39:
            alert("右键");
            break;
    }
}

每个键盘按键都有编码，按键测试。

document.addEventListener("keydown",keydown);
//键盘监听，注意：在非ie浏览器和非ie内核的浏览器
//参数1：表示事件，keydown:键盘向下按；参数2：表示要触发的事件
function keydown(event){
//表示键盘监听所触发的事件，同时传递传递参数event
    document.write(event.keyCode);//keyCode表示键盘编码
}

同一个列表中，改变列表项的顺序：

<ul id="myList"><li>Coffee</li><li>Tea</li><li>Water</li><li>Milk</li></ul>

<p id="demo">单击该按钮改变列表项的顺序</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction(){
    var list=document.getElementById("myList");
    var node=list.getElementsByTagName("li");
    list.insertBefore(node[3],node[1]);
}
</script>

尝试一下 »

用 document.getElementById("demo").innerHTML 输出时，当 + 两边的数据类型都为 Number，则这个 + 是一个运算符。

如：

document.getElementById("demo").innerHTML = 1 + 9 + 8; // 输出为 18

但如果 + 两边的数据类型不同时，这个 + 就类似于句子里的“和”的意思。

如：

document.getElementById("demo").innerHTML = 1 + 9 + "onlyA" + 8; // 输出 10onlyA8。

使用 innerHTML 时若与 createElement 同级并且 innerHTML 在后会出现事件无法绑定，原因是 innerHTML 后父级 DOM 重新加载。例如：

/*有问题的情况*/
function c(){
  var a = document.createElement("div");
  var a1 = document.createElement("div");
  a1.innerText = "点我不会执行onclick";
  a1.onclick = function(){alert(1)};
  a.appendChild(a1);
  a.innerHTML += "<b></b>";
  document.getElementsByTagName("body")[0].appendChild(a);
}

/*没问题的情况*/
function c(){
  var a = document.createElement("div");
  a.innerHTML += "<b></b>";
  var a1 = document.createElement("div");
  a1.innerText = "点我会执行onclick";
  a1.onclick = function(){alert(1)};
  a.appendChild(a1);
  document.getElementsByTagName("body")[0].appendChild(a);
}