onload事件

最新推荐文章于 2024-09-11 15:33:18 发布

爱与意志

最新推荐文章于 2024-09-11 15:33:18 发布

阅读量690

点赞数

分类专栏： javaweb 文章标签： javascript html html5

本文链接：https://blog.csdn.net/qq_45361567/article/details/120812417

版权

javaweb 专栏收录该内容

35 篇文章 0 订阅

订阅专栏

onload事件：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script type="text/javascript">
        //onload事件的方法
        function onloadFun(){
            alert('静态注册onload事件，所有代码');
        }

        //onload事件动态注册，是固定写法
        window.onload = function (){
            alert("动态注册onload事件");
        }
    </script>
</head>
<!--静态注册onload事件
    onload事件是浏览器解析完页面之后就会自动触发的事件
    <body onload="onloadFun()">
-->
<body>

</body>
</html>

onclick

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">
        function onclickFun(){
            alert("静态注册onclick事件");
        }

        //动态注册onclick事件
        window.onload = function (){
            //1.获取标签对象
            /*
            * document是JavaScript语言提供的一个对象（文档）
            * get           获取
            * Element       元素（就是标签）
            * By            通过....      由...经...
            * ID            id属性
            * */

            var btnObj = document.getElementById("btn01");
            //alert(btnObj);
            //2.通过标签对象，事件名 = function(){}
            btnObj.onclick = function (){
                alert("动态注册的onclick事件")
            }
        }
    </script>
</head>
<body>
    <!--静态注册onClick事件-->
    <button onclick="onclickFun();">按钮1</button>
    <button id = "btn01">按钮2</button>
</body>
</html>