javascript和jquery动态创建html元素

转载地址：http://www.cnblogs.com/ajun/archive/2012/06/14/2549091.html

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);

  }