首页 > 解决方案 > Jquery函数(文件加载)按顺序

问题描述

我正在使用下面的代码按顺序加载文件并在页面加载时加载。但我得到了

$ 不是函数

最后一个文件“scripts.js”的错误。换句话说,jquery 和 bootstrap 文件总是正确加载,但最后一个文件(我的自定义脚本)显示错误并且没有任何自定义工作。我在做什么?谢谢你的帮助 :)

<script type="text/javascript">
function chamajquery() {
    var element = document.createElement("script");
    element.src = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/jquery-3.6.0.min.js";
    document.body.appendChild(element);
    chamabootstrap();
}
function chamabootstrap() {
    var element2 = document.createElement("script");
    element2.src = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/bootstrap.bundle.min.js";
    document.body.appendChild(element2);
    chamascriptsmanuais();
}
function chamascriptsmanuais() {
    var element3 = document.createElement("script");
    element3.src = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/scripts.js";
    document.body.appendChild(element3);
}
window.addEventListener("load", chamajquery);

标签: jqueryloadscript

解决方案


  1. 我希望脚本附加到头部而不是正文
  2. 您的问题可能是时间问题
  3. 为什么要使用这种复杂的方式?如果您想让页面加载更快,只需在</body>标签之前添加所有 3 个脚本

<script src="<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/jquery-3.6.0.min.js"></script>
<script src="<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/bootstrap.bundle.min.js"></script>
<script src="<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/scripts.js"></script>
</body>

使用 onload 的替代方法(可以更改为 addEventListener)

<script type="text/javascript">
function chamajquery() {
    const element1 = document.createElement("script");
    element1.onload=chamabootstrap;
    element1.src1 = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/jquery-3.6.0.min.js";
    document.querySelector("head").appendChild(element1);
}
function chamabootstrap() {
    const element2 = document.createElement("script");
    element2.onload=chamascriptsmanuais;
    element2.src = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/bootstrap.bundle.min.js";
    document.querySelector("head").appendChild(element2);
}
function chamascriptsmanuais() {
    const element3 = document.createElement("script");
    element3.src = "<?php echo esc_url(get_template_directory_uri()); ?>/assets/js/scripts.js";
    document.querySelector("head").appendChild(element3);
}
window.addEventListener("load", chamajquery);

推荐阅读