Servlet 动态生成 HTML 时，若在 标签中同时指定 src 属性并内嵌 JS 代码，会导致浏览器忽略内联脚本，引发 Cannot set properties of undefined 等运行时错误；正确做法是分离外部脚本引入与初始化逻辑。

servlet 动态生成 html 时，若在 `<script>` 标签中同时指定 `src` 属性并内嵌 js 代码，会导致浏览器忽略内联脚本，引发 `cannot set properties of undefined` 等运行时错误；正确做法是分离外部脚本引入与初始化逻辑。</script>

在 Java Servlet 中通过 PrintWriter out 输出 HTML 和 JavaScript 是常见做法，但需严格遵循 HTML 规范。你遇到的 Uncaught TypeError: Cannot set properties of undefined (setting 'innerHTML') 错误，根本原因在于以下非法写法：

Java JDK 25

Java JDK 25 来自 OpenJDK 官方归档，版本为 JDK 25，本条下载地址已指向官方 Windows x64 zip 安装包直链，适合调试旧项目或兼容旧版 Java 运行环境。

下载

out.println("<script type="text/javascript" src="app.js">");
out.println("Calendar.$calendar = document.querySelector('.calendar')");
out.println("Calendar.$date = document.querySelector('.cur-date')");
out.println("Calendar.init()");
out.println("</script>");

⚠️ 问题解析：
根据 HTML 规范，当 <script> 标签包含 src 属性时，其<strong>标签体内容（即开始与结束标签之间的 JavaScript 代码）将被浏览器完全忽略。这意味着 Calendar.$calendar = ... 等初始化语句从未执行，导致 Calendar 对象未被正确挂载或 DOM 元素未被赋值，后续调用 Calendar.init() 时访问 Calendar.$calendar.innerHTML 就会因 $calendar 为 undefined 而抛出错误。</script>

✅ 正确写法：分两步声明脚本

1. 先引入外部 JS 文件（app.js）；
2. 再单独声明一个无 src 的 <script> 标签，用于执行页面级初始化逻辑：</script>

out.println("<script type="text/javascript" src="app.js"></script>");
out.println("<script type="text/javascript">");
out.println("  // 确保 DOM 加载完成后再执行");
out.println("  document.addEventListener('DOMContentLoaded', function() {");
out.println("    Calendar.$calendar = document.querySelector('.calendar');");
out.println("    Calendar.$date = document.querySelector('.cur-date');");
out.println("    if (Calendar && Calendar.init) {");
out.println("      Calendar.init();");
out.println("    } else {");
out.println("      console.error('Calendar module not loaded or init() not defined');");
out.println("    }");
out.println("  });");
out.println("</script>");
out.println("

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南