如何在页面加载时调用JavaScript函数?

2020/10/10 01:21 · javascript ·  · 0评论

传统上,要在页面加载后调用JavaScript函数,您onload需要在包含一些JavaScript的正文中添加一个属性(通常只调用一个函数)

<body onload="foo()">

页面加载后,我想运行一些JavaScript代码以使用服务器中的数据动态填充页面的某些部分。onload因为我使用的是JSP片段,所以我无法使用该属性,而JSP片段没有body可以添加属性的元素。

还有其他方法可以在加载时调用JavaScript函数吗?我宁愿不使用jQuery,因为我对此不太熟悉。

如果希望onload方法采用参数,则可以执行以下操作:

window.onload = function() {
  yourFunction(param1, param2);
};

这会将onload绑定到一个匿名函数,该匿名函数在调用时将使用您提供的任何参数运行所需的函数。而且,当然,您可以从匿名函数内部运行多个函数。

另一种方法是使用事件侦听器,这里是如何使用它们:

document.addEventListener("DOMContentLoaded", function() {
  you_function(...);
});

说明:

DOMContentLoaded这意味着当文档的DOM对象完全加载并被JavaScript看到时,也可能是“单击”,“焦点” ...

function()匿名函数,将在事件发生时被调用。

您最初的问题尚不清楚,假设Kevin的编辑/解释正确,则第一个选项不适用

典型的选项是使用onload事件:

<body onload="javascript:SomeFunction()">
....

您也可以将javascript放在正文的最后;在文档完成之前,它不会开始执行。

<body>
  ...
  <script type="text/javascript">
    SomeFunction();
  </script>
</body>

并且,另一个选择是考虑使用本质上是这样做的JS框架:

// jQuery
$(document).ready( function () {
  SomeFunction();
});
function yourfunction() { /* do stuff on page load */ }

window.onload = yourfunction;

或使用jQuery(如果需要):

$(function(){
   yourfunction();
});

如果要在页面加载时调用多个函数,请查看本文以获取更多信息:

<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript">
        function codeAddress() {
            alert('ok');
        }
        window.onload = codeAddress;
        </script>
    </head>
    <body>
    
    </body>
</html>

您必须调用要在加载时调用的函数(即,文档/页面的加载)。例如,您要在文档或页面加载时加载的函数称为“ yourFunction”。这可以通过在文档的load事件上调用函数来完成。请参阅下面的代码以获取更多详细信息。

请尝试以下代码:

<script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript">

    $(document).ready(function () {
        yourFunction();
    });
    function yourFunction(){
      //some code
    }
</script>

这是窍门(无处不在):

r(function(){
alert('DOM Ready!');
});
function r(f){/in/.test(document.readyState)?setTimeout('r('+f+')',9):f()}

MutationObserver当数据准备好使用时,用于检测插入到DOM中的(从服务器中)加载的html(从服务器)使用或检测loadContent函数中的时刻

本文地址:http://javascript.askforanswer.com/ruhezaiyemianjiazaishidiaoyongjavascripthanshu.html
文章标签: ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!