1、打开Sublime text3，新建一个HTML文档，并且建立好框架。
2、输入代码：
<table>
<tr>
<td>Student</td>
<td><input type="text" name="student"></td>
</tr>
<tr>
<td>Height</td>
<td><input type="text" name="height"></td>
</tr>
<tr>
<td colspan=2>
<input type="button" name="add" value="add">
</td>
</tr>
</table>
设立两行文本输入框，并且提示可以增加的按钮。
3、<table id="mainTable">
为标签加上id方便定位。
4、加上监听事件的函数。
onclick="adding()"
然后连接js文档。
<script src="test.js"></script>
5、function adding(){
var table = document.getElementById("mainTable")
var addTr = table.insertRow(2)
}
创建函数，然后设定两个变量。一个用于定位标签位置，另一个增加行数在第二行。测试一下，多次点击确实会往下移动。
6、var addTd = addTr.insertCell()
addTd.innerHTML = "新增"
除了要增加tr还要增加td，并且增加文本提示。
7、稍微修改一下变量名字。再增加文本输入框。
function adding(){
var table = document.getElementById("mainTable")
var addTr = table.insertRow(2)
var td1 = addTr.insertCell()
td1.innerHTML = "新增"
var td2 = addTr.insertCell()
td2.innerHTML = "<input type='text 'name='newnew' >"
}
8、最后就可以看到按钮了。
事件属性button，是触发事件的时候，获取事件对象获取button的值判断，是按下了鼠标的哪个键。
1、首先创建一个名称为button的html文件，如下图所示。
2、在body中加入onmousedown事件，事件中加入自定义函数，函数中加入事件返回对象。
3、接着加入一个p标签加入id，如下图所示。
4、然后创建一个自定义函数mybutton，如下图所示。
5、自定义函数中通过event。button属性获取整数值，并判断整数值来区分鼠标按键。
6、最后在浏览器中打开文件，在指定区域随意按下鼠标按键，查看结果。
可以使用input的click事件进行处理，这里假设点击转向的链接是百度，方法如下：
1、DOM0级事件处理:
1）html代码：<input name="注册" type="button" id="btn1" title="登注册" value="注册" o nclick="goToBaiDu()"/>
2）js代码：
function goToBaiDu(){
console.log('现在去百度啦！')
window.open('http://www.baidu.com')
}
效果如下：
2、DOM2级事件，绑定click事件，如下：
1）html代码：<input name="注册" type="button" id="btn1" title="登注册" value="注册"/>
2）js代码：
window.onload = function(){
document.getElementById('btn1').addEventListener('click',goToBaiDu)
}
function goToBaiDu(){
console.log('现在去百度啦！')
window.open('http://www.baidu.com')
}
效果如下：
3、上面的方式的打开一个新窗口，还有一个打开链接的方式，是在当前标签页下直接跳转到另一个页面，代码如下：
window.location.href="http://www.baidu.com"
