嘿，我来帮你搞定这个头疼的问题！引入jQuery后页面直接空白，移除JS就正常，这种情况几乎都是JavaScript报错导致页面渲染中断了，咱们一步步排查：

1. 先确认本地jQuery文件是否完好 #

有时候下载的JS文件可能因为网络问题损坏，或者下载的不是完整版本：

• 直接打开本地的jquery-3.3.1.min.js和jquery-migrate-1.4.1.js，看看里面是不是有正常的压缩代码，要是是空文件、乱码或者只有几行，那肯定是文件坏了，重新去jQuery官方渠道下载完整版本就行。
• 可以先试试用CDN引入代替本地文件测试：

  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script src="https://code.jquery.com/jquery-migrate-1.4.1.min.js"></script>
  

  如果用CDN后页面能正常显示，那百分百是你本地的JS文件有问题。

2. 查看浏览器控制台的报错信息 #

这是最关键的一步，能直接告诉你问题出在哪：

• 打开Chrome开发者工具（按F12，或者右键页面选「检查」），切换到「Console」标签页，刷新页面，看看有没有红色的错误提示。
  • 如果提示$ is not defined：说明jQuery根本没加载成功，大概率是文件路径写错了。
  • 如果提示某个函数不存在或者语法错误：那就是你的自定义JS代码和jQuery 3.x不兼容，比如用了已经被移除的API（像$.browser）。

3. 排查自定义JS代码的冲突 #

如果有自己写的JS代码，先把它全部注释掉，只保留jQuery的引入，看看页面能不能正常显示：

• 如果注释后页面正常了，那就逐段放开自己的JS代码，找到引发错误的那部分。
• jQuery 3.x移除了不少旧版本的API，jquery-migrate本来是用来兼容这些旧代码的，但如果代码里的API太旧，或者migrate和jQuery版本适配出问题，也会报错，这时候migrate会在Console里输出兼容提示，注意看这些提示。

4. 确认文件路径是否正确 #

虽然你说所有文件都在同一文件夹，但还是要仔细检查：

• 引入路径是不是写对了？比如是不是<script src="jquery-3.3.1.min.js"></script>，有没有拼写错误（比如把jquery写成jqury）？
• 注意大小写！如果你的系统是区分大小写的（比如Linux或者某些配置的Windows），文件名是jQuery-3.3.1.min.js但你写的全小写，也会加载失败。

5. 单独引入单个JS文件测试 #

不要同时引入jQuery和migrate，先只引入jquery-3.3.1.min.js，看看页面能不能正常显示：

• 如果单独引入jQuery没问题，再加入migrate，就能确定是不是migrate插件的问题。

如果按照上面的步骤还是没解决，把控制台里的错误信息贴出来，就能更快定位问题啦！

内容的提问来源于stack exchange，提问作者Ashley