jquery 动态创建 DIV

最新推荐文章于 2022-05-10 09:17:31 发布

原创最新推荐文章于 2022-05-10 09:17:31 发布 · 10w+ 阅读

21 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #div #function #css

Java 同时被 3 个专栏收录

84 篇文章

订阅专栏

Javascript

14 篇文章

订阅专栏

JQuery

9 篇文章

订阅专栏

本文提供了两种使用JavaScript动态创建div元素的方法。第一种方法通过创建父div和子div，并为它们添加属性及样式来实现。第二种方法直接定义了一个带有样式的div字符串，在窗口加载完成后将其添加到页面中。

方法一：

var creatediv= function(){
    var parentdiv=$('<div></div>');        //创建一个父div
    parentdiv.attr('id','parent');        //给父div设置id
    parentdiv.addclass('parentdiv');    //添加css样式

    var childdiv=$('<div></div>');        //创建一个子div
    childdiv.attr('id','child');            //给子div设置id
    childdiv.addclass('childdiv');    //添加css样式
    childdiv.appendto(parentdiv);        //将子div添加到父div中

parentdiv.appendto('body'); //将父div添加到body中
}

方法二：

var boarddiv = "<div style='background:white;width:100%;height:100%;z-index:999;position:absolute;top:0;margin-top:100px;'>加载中...</div>";
$(window).load(function(){
//window.alert("ok");
$(document.body).append(boarddiv);
});