HTML5网页设计

javaScript

Javascript和jQuery动态创建html元素

时间:2015-12-29 16:32来自:未知作者:user点击:
1、javascript创建元素 创建select var select = document.createElement(select);elect.options[0] = new Option(加载项1, value1);select.options[1] = new Option(加载项2, value2);select.size = 2;testDiv.appendChild(select); 创建div var openDiv =

1、javascript创建元素

创建select

var select = document.createElement("select");
elect.options[0] = new Option("加载项1", "value1");
select.options[1] = new Option("加载项2", "value2");
select.size = "2";
testDiv.appendChild(select);

创建div

var openDiv = document.createElement("div");
openDiv.id = "div3D";
openDiv.style.width = w+"px";
openDiv.style.height = h+"px";
openDiv.innerHTML = strHtml;
document.body.appendChild(openDiv);


2、jquery创建元素

function CreateDom() {
	var select = $("<select/>").appendTo($("body"));
	var option1 = $("<option value=\"1\">text1</option>").appendTo(select);
	var option2 = $("<option value=\"2\">text2</option>").appendTo(select);
	var option3 = $("<option value=\"3\">text3</option>").appendTo(select);
	var text = $("<input type=\"text\">").css({ "width": "150px", "border": "1px lightgrey solid" }).appendTo($("body"));
	var checkbox = $("<input type=\"checkbox\" />").appendTo($("body"));
	var ul = $("<ul/>").appendTo($("body"));
	var li = $("<li>li1</li>").appendTo(ul);
	var li = $("<li>li2</li>").appendTo(ul);
}

当前文章地址:http://www.shejicool.com/web/javaScript/634.html

阅完本篇文章?您还可以: 收藏本文 文章挑错 朋友推荐