jquery實現樓層巢狀(DIV巢狀)
阿新 • • 發佈:2019-01-26
經常看到評論區回覆樓層巢狀,也就是蓋樓,下面來用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>
效果圖: