jquery实现楼层嵌套（DIV嵌套）

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

yy211zhu

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

阅读量3.4k

点赞数

分类专栏： Jquery web 文章标签： jquery javascript html css

本文链接：https://blog.csdn.net/yy211zhu/article/details/52054438

版权

Jquery 同时被 2 个专栏收录

13 篇文章 0 订阅

订阅专栏

web

13 篇文章 0 订阅

订阅专栏

经常看到评论区回复楼层嵌套，也就是盖楼，下面来用jquery来实现div布局

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/jquery-2.2.3.js"></script>
    <style>
        #maindiv{width:auto; height:auto; margin: 0 auto; position: relative;}
        .common{border:1px solid #1b6d85; padding: 20px;height:auto; width:auto;}
    </style>
</head>
<body>
<div id="maindiv" class="common">

</div>
<div id="jsdiv">

</div>
<script>
    $(function(){
        function setdiv(i,j){
            var cdiv=$('<div></div>');
            cdiv.addClass("common").text(i);
            $("#maindiv").wrapAll(cdiv);
            i++;
            if(i<=j){
                return setdiv(i,j);
            }else {
                return false;
            }
        };
        setdiv(1,10);
    })
    
</script>
</body>
</html>

效果图：