如何从A.jsp调用B.jsp中的deleteLANode函数且不引入全部内容？

嘿，这个问题我熟！直接从A.jsp调用B.jsp里的deleteLANode函数其实是行不通的，原因很简单：

当浏览器加载并渲染A.jsp页面时，B.jsp的内容并没有被包含到当前页面的DOM和JavaScript执行环境中——JSP是在服务器端处理的，除非你通过某种方式把B.jsp里的目标函数代码注入到A.jsp的输出里，否则浏览器根本找不到这个函数，直接调用只会报deleteLANode is not defined的错误。

不重复编写函数的最佳解决方法 #

最规范、可维护的做法是把共用的JavaScript函数抽离到独立的外部JS文件中，具体步骤如下：

1. 创建独立的工具JS文件
   新建一个比如lanode-utils.js的文件，把deleteLANode(nodeUniqueId)函数单独放在这里：

   function deleteLANode(nodeUniqueId) {
       // 这里放原来B.jsp中该函数的逻辑代码
   }
   

2. 在需要的JSP中引入这个JS文件
   在A.jsp和B.jsp的合适位置（比如</body>标签前）分别引入这个外部JS文件：

   <script src="path/to/lanode-utils.js"></script>
   

   注意替换path/to/为实际的文件路径，比如如果你的JS文件放在项目的webapp/js/目录下，路径就是src="js/lanode-utils.js"。

3. 直接调用函数即可
   现在A.jsp里的executeConfirmDel函数就能正常调用deleteLANode(nodeUniqueId)了，B.jsp也能继续使用这个函数，而且完全不会引入彼此页面中无关的代码。

为什么这是最佳方案？ #

相比其他临时方案（比如用AJAX加载B.jsp的部分代码、通过iframe跨上下文调用），抽离独立JS文件的方式：

• 符合代码复用和关注点分离的原则，代码更整洁
• 避免了服务器端包含带来的冗余代码加载问题
• 方便后续统一维护函数逻辑，改一处就能同步到所有使用的页面

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