Question

我一直在重新考虑我的一些模板，并在模板文件的底部放置了jQuery代码的链接，以保持页面加载速度快。

我还有一些我只在特定页面上使用的javascript模块，因此我不会在主模板中包含这些模块，而是包含在内容中。

以下是模板的外观......

<html>
    <head>
    </head>
    <body>

        <!-- navigation -->
        <nav></nav>
        <!-- end navigation -->

        <!-- main content -->
        <?php $this->load->view($module . '/' . $view_file); ?>
        <!-- end main content -->

        <!-- footer -->
        <footer></footer>
        <!-- end footer -->

        <!-- javascript dependencies -->
        <script src="<?php echo base_url('bower_components/jquery/dist/jquery.min.js'); ?>"></script>

    </body>
</html>

如果我将自定义js代码添加到模板内的特定页面，如下所示：

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>

        <!-- navigation -->
        <nav></nav>
        <!-- end navigation -->

        <!-- main content -->
        <?php $this->load->view($module . '/' . $view_file); ?>
        <!-- end main content -->

        <script src="some custom js that uses jQuery"></script>

        <!-- footer -->
        <footer></footer>
        <!-- end footer -->

        <!-- javascript dependencies -->
        <script src="<?php echo base_url('bower_components/jquery/dist/jquery.min.js'); ?>"></script>

    </body>
</html>

我收到错误

ReferenceError: $ is not defined

所以我必须将我的jQuery和其他依赖项放在文档头中还是有其他方法？

Answer 1

您收到此错误是因为脚本在加载jQuery之前正在运行，因此未定义。

要解决此问题，只需将自定义脚本放在jQuery导入下面的行中即可。

或者，将jQuery导入放在页面的更高位置，使其始终位于自定义脚本之上，并且可以正常工作。

将jQuery放在HTML模板的底部是不灵活的

1 个答案: