jQuery在外部javascript文件中不起作用_Javascript_Jquery_Html

jQuery在外部javascript文件中不起作用

javascript jquery html

jQuery在外部javascript文件中不起作用,javascript,jquery,html,Javascript,Jquery,Html,所以我是JavaScript的初学者我有一个简单的HTML文件，我试图用$（“h1”）.hide（）测试jQuery，我的问题是jQuery代码在HTML中工作，但当我尝试将此代码放入外部JavaScript文件testjs.js中，并通过脚本标记将其插入头，它就不再工作了。为了清楚起见，外部JavaScript文件是可以识别的，例如，当我在外部JS文件中放入document.write（“第三次测试”）时，它将显示“第三次测试”。希望我已经说清楚了 <!doctype html>

所以我是JavaScript的初学者

我有一个简单的HTML文件，我试图用

$（“h1”）.hide（）测试jQuery，我的问题是jQuery代码在HTML中工作，但当我尝试将此代码放入外部JavaScript文件testjs.js中，并通过脚本标记将其插入头，它就不再工作了。为了清楚起见，外部JavaScript文件是可以识别的，例如，当我在外部JS文件中放入document.write（“第三次测试”）时，它将显示“第三次测试”。
希望我已经说清楚了
<!doctype html>
<html>
    <head>
        <title>Test</title>
         <meta charset="utf-8"/>
         <script src="jquery-3.3.1.min.js"></script>
         <script src="js/testjs.js"></script>
   </head>
   <body>
       <h1>first test</h1>
       <p>second test</p>

   <!-- this works only here but not in external js file
   <script>
    $("h1").hide();
   </script>
   -->
   </body>
</html>


试验
第一次测试
第二次测试
可能是DOM没有加载要隐藏的h1元素。尝试在testjs.js中使用此代码
$(document).ready(function() {
    $('h1').hide();
});

操作元素时，您应该等待文档完全加载。
可能是DOM没有加载您试图隐藏的h1元素。尝试在testjs.js中使用此代码
$(document).ready(function() {
    $('h1').hide();
});

操作元素时，应等待文档完全加载。
问题在于文档加载执行。执行$（'h1'）.hide（）
刚好在文档完全加载之前
三种选择

将脚本放在正文的底部



使用jQuery中的内置函数ready


问题在于文档加载执行。执行$（'h1'）.hide（）
刚好在文档完全加载之前
三种选择

将脚本放在正文的底部



使用jQuery中的内置函数ready


您是否按照相同的顺序将其放入了testjs.js
文件中？将行置于标记底部无需在其他文件中添加
标记。并在底部添加脚本文件，或者将文件移到
之前的底部，或者将代码包装到$（function（）{$（“h1”）.hide（）；}）
您是否按照相同的顺序将其放入testjs.js
文件中？将行置于标记底部无需在其他文件中添加
标记。并在底部添加脚本文件，或者将文件移到
之前的底部，或者将代码包装到$（function（）{$（“h1”）.hide（）；}）
document.addEventListener("DOMContentLoaded", function(event) {
   $('h1').hide();
});

$(document).ready(function() {
    $('h1').hide();
});