onload()方法只能在body標簽中調用嗎?怎么調用多個多個方法?


第一個問題:

onload()方法並非只能在body標簽中調用的,還可以在js中用window.onload = function() {函數名};來調用;另外img等標簽也支持onload方法。

支持onload方法的標簽有:<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

window.onload = function(){drawRed()};
<img id="img1" src="src/img1.jpg" onload="changeImg()"></img>

第二個問題:

同時調用多個方法時,可以在body中使用<body onload="函數名1;函數名2;函數名3;......">的方式:

<body onload="drawBlack();drawRed()">

舉例說明一下:

<!DOCTYPE HTML>
<html>

    <head>
        <meta charset="UTF-8">
        <title>HTML5畫布</title>

        <!--利用js在畫布上繪制圖案-->
        <script type="text/javascript">

            function drawRed() {
                var c = document.getElementById("myCanvas");
                var cxt = c.getContext("2d");
                cxt.fillStyle = "#FF0000";
                cxt.beginPath();
                cxt.arc(70, 18, 15, 0, Math.PI * 2, true);
                cxt.closePath();
                cxt.fill();
            }
            
            function drawBlack() {
                var c = document.getElementById("myCanvas");
                var cxt = c.getContext("2d");
                cxt.fillStyle = "#000000";
                cxt.beginPath();
                cxt.arc(170, 18, 15, 0, Math.PI * 2, true);
                cxt.closePath();
                cxt.fill();
            }
            
            function changeImg() {
                document.getElementById("img1").src = "src/bg.jpg";
            }
            
            // onload()方法的調用方式之一
            window.onload = function(){drawRed()}; window.onload = function(){drawBlack()}; </script>

    </head>

    <!--onload()方法的調用方式之二-->
    <body onload="drawBlack();drawRed()">
        <!--定義一塊畫布-->
        <canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
            Your browser does not support the canvas element.
        </canvas>
        <img id="img1" src="src/img1.jpg" onload="changeImg();drawBlack();drawRed()"></img>

    </body>

</html>

執行效果如下:

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM