Javascript 脚本未从外部文件执行

我被一个愚蠢而神秘的问题困扰了几个小时。JQuery在

之间工作，但在从外部文件调用时不工作。我一定是犯了个愚蠢的错误，但在哪里

我的HTML中有这个（您会注意到，标准引导导入）：

但是，如果我将相同的代码放入

custom.js

，则不会显示任何内容。下面是

custom.js

内容：

$(function() {
    $( "#Title" ).append( '<h1 class="text-capitalize">Title</h1>' );
});

$（函数（）{
$（“#标题”）。追加（‘标题’）；
});

以及修改后的HTML：

<!-- Bootstrap core JavaScript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script src="../static/js/bootstrap.min.js"></script>
        <script src="../../assets/js/docs.min.js"></script>
        <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
        <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
    <!-- Custom JavaScript
        ================================================== -->
    <script src="custom.js"></script>   

    <div class="col-xs-4">
        <div id="my_camera"></div>
        <div id="Title"></div>

    </div>

---

可能在呈现HTML之前调用了JS。尝试将其包装到ready函数中

$(document).ready(function(){
    $( "#Title" ).append( '<h1 class="text-capitalize">Title</h1>' );
});

$（文档）.ready（函数（）{
$（“#标题”）。追加（‘标题’）；
});

事实上，问题似乎与Jquery无关。我使用的是Flask python框架，似乎除了

static

之外，我无法设置其他目录的路径。因此，应用程序看不到来自

静态

之外的任何内容

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<script src="../../assets/js/docs.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
<!-- Custom JavaScript
================================================== -->
<script src="../static/js/custom.js"></script>  

custom.js内容：

$(document).ready(function () {
    $( "#left-col" ).append( '<h1 class="text-capitalize">Title</h1>' );
});

$（文档）.ready（函数（）{
$（“#左栏”）。追加（'Title'）；
});

这里唯一可能出错的是您的路径错误。我们无法提供我们所拥有的信息。请尝试将代码包装在

$（document）.ready（function（）{}）中

@Mikey，这就是

$（function（）{…

所做的。@isherwood我怀疑是这样的。但是这两个文件在同一个目录中！！好吧，这是一件在控制台中检查的简单事情。查找404个错误。

$（function（）{…}）；

是jQuery中document.ready的简写形式。而且，在这两种情况下都会存在这种情况。再次验证custom.js文件的确切路径，否则将在控制台中发布您遇到的确切错误。@Saurabh为什么将您的评论发布在“答案”下，而不是“问题”下？@Regent错误发布。

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<script src="../../assets/js/docs.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
<!-- Custom JavaScript
================================================== -->
<script src="../static/js/custom.js"></script>  

$(document).ready(function () {
    $( "#left-col" ).append( '<h1 class="text-capitalize">Title</h1>' );
});