如何用js创建元素？

JavaScript010

如何用js创建元素？,第1张

var div =document.getElementById('listcont')；

var child =div.createElement("div")；

child.class="cont"

div. appendChild(child)这样就能把一个子div加进去ID为listcont的div的里面了，其他元素可类似这样添加

var useObj=new Object() //创建一个新的Object

var tempStr1="字符串1" //字符串1

var tempStr2="字符串2" //字符串2

var tempArr=new Array() //创建一个数组对象

useObj.tempStr1=tempStr1 //给自建对象设置属性tempStr1.并给属性赋值tempStr1（一个是属性一个是带有字符串的变量）

useObj.tempStr2=tempStr2 //给自建对象设置属性tempStr2.并给属性赋值tempStr2（一个是属性一个是带有字符串的变量）

useObj.tempArr=tempArr //给自建对象设置属性tempArr.并给属性赋值tempArr（一个是属性一个是数组变量）

当然以上属性名和值，你可以自己设置。

完成后你可以通过alert（）查看设置的对象里的值。

1.首先创建html结构，如下图所示，一个input元素，一个按钮，一个空的ul列表。

2.然后添加按钮点击事件，如下图所示，在按钮点击事件中获得input元素。

3.通过value属性我们可以获得用户在input中输入的内容，如下图所示。

4.下面我们来动态创建一个li元素，如下图所示，运用document中的createElement方法即可。

5.创建好li元素以后，下面要做的就是给其设置innerHTML内容，如下图所示。

6.接下来就是获取ul元素了，如下图所示，仍然用getElementById方法。

7.最后通过调用appendChild方法将创建的li元素添加到ul列表中，如下图所示。