Spring Boot中外部JS文件无法使用jQuery命令的问题

外部JS文件完全可以正常使用jQuery，没必要非得把代码写在HTML内联脚本里，你遇到的报错大概率是脚本引入顺序、路径或库冲突的问题，按以下步骤排查修复：

• 检查脚本引入顺序
  浏览器会按脚本标签的顺序依次加载执行代码，必须保证先引入jQuery库，再引入你的content.js。如果content.js先加载，此时jQuery还未被解析，自然找不到全局变量$。
  正确的引入示例：

  <!-- 先加载jQuery -->
  <script src="/js/jquery.min.js"></script>
  <!-- 再加载自定义脚本 -->
  <script src="/js/content.js"></script>
  

• 验证jQuery的引入路径是否正确
  Spring Boot的静态资源默认存放在src/main/resources/static目录下，比如你把jQuery放在static/js/jquery.min.js，HTML里的引入路径应为/js/jquery.min.js（开头的斜杠代表从静态资源根目录出发）。
  可以打开浏览器开发者工具（F12）的Network面板，刷新页面后查看jQuery的请求状态：如果返回404，说明路径错误，需要修正。

• 排查库冲突问题
  如果页面还引入了其他JS库（比如Prototype、Zepto），它们可能会占用$变量，导致jQuery的$失效。这种情况下，有两种解决方式：

  1. 把content.js里的$替换成jQuery
  2. 在content.js开头释放$的控制权：

  jQuery.noConflict();
  // 后续用jQuery代替$
  jQuery(document).ready(function() {
      // 你的业务代码
  });
  

• 可选优化：将脚本放在页面底部
  把脚本标签放在</body>标签之前而非页面头部，既能确保DOM元素已加载完成（此时甚至可以不用$(document).ready，代码也能正常执行），还能避免脚本阻塞页面渲染。

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