学习日记--回到首页、jq简写、js添加div

版权声明：本文为博主原创文章，部分内容为借鉴理解。 https://blog.csdn.net/weixin_35773751/article/details/88610516

1.回到首页

$('img').click(function(){
	$('html,body').animate({scrollTop:0},'slow');  //回到首页
})

2.jq简写

1.
$(documnet).ready(function(){})

2.
$().ready(function(){})

3.
$(function(){})

3.js添加多个div

<div id="add" style="width: 500px;height: 300px;border: 1px solid red; display:flex; justify-content:space-around;"></div>
    <button onclick="add()"></button>

    <script>
        function add(){
            for(var i=0;i<3;i++){
                var div = document.createElement('div');
                div.innerHTML="<div id=a"+ i +">内部div</div>";
                div.style.cssText="background:red; margin-left:5px; display:flex;flex-direction: column;";
                document.querySelector('#add').appendChild(div);
                for(var u=0;u<3;u++){
                    var div2 = document.createElement('div');
                    div2.innerHTML="<div>内部div</div>";
                    div2.style.cssText="background:blue; margin-top:5px;";
                    document.querySelector('#a'+i).appendChild(div2);
                }
            }
        }
    </script>

效果图：