js增加列表的方法

1、创建index.html文件，用可编辑文本文件的软件打开。

在index.html添加如图内容。

2、使用chrome浏览器打开后的效果如图。

1、增加列表的第一种方式是直接用拼接字符串的方式。

编写函数 addByStrAppend()，函数内容如图。

编写完后在button的onclick中使用该函数。

2、保存文件后用浏览器打开index.html，效果如图。

在输入学号和姓名，点击添加后，列表会将添加的数据拼接到列表的最后一行。

1、第二种方式是使用JS原生函数创造节点后再作为子节点，接到tbody上。

编写函数 addByJSFun()，函数内容如图。

编写完后在button的onclick中使用该函数。

2、保存文件后用浏览器打开index.html，效果如图。

1、第三种方式是用jQuery的html()函数将添加的数据拼接到tbody中。

使用jQuery要先下载jQuery库，下载完后将其存放在和index.html的同一目录下，再在index.html中引入jQuery。

2、编写函数 addByJQStrAppend()，函数内容如图。

编写完后在button的onclick中使用该函数。

3、保存文件后用浏览器打开index.html，效果如图。

1、第四种方式是用jQuery的append()函数将添加的数据拼接到tbody中。

编写函数 addByJQAppend()，函数内容如图。

编写完后在button的onclick中使用该函数。

2、保存文件后用浏览器打开index.html，效果如图。

3、整个文件目录及index.html的内容如图。