如何从 html 中的内联 js 脚本获取变量并将其放入外部 .js 文件？

Question

我想将通过内联脚本获得的变量放入：index.ejs 文件中。这是我得到的代码是：$(function(){  var finalpoints = points; var finalcosts = costammount; finaldata = [finalpoints,finalcosts];});我在外部文件中的代码是：(function( detail, $, undefined, index) {    'use strict';    var fd= finaldata;})(fd, jQuery);什么也没发生..它确实错误：ReferenceError: fd is not definedat /app/index.js:95:4    at Layer.handle [as handle_request] (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/layer.js:95:5)    at next (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/route.js:137:13)    at Route.dispatch (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/route.js:112:3)    at Layer.handle [as handle_request] (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/layer.js:95:5)    at /rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/index.js:281:22    at Function.process_params (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/index.js:335:12)    at next (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/index.js:275:10)    at serveStatic (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/serve-static/1.14.1/node_modules/serve-static/index.js:75:16)    at Layer.handle [as handle_request] (/rbd/pnpm-volume/9dc75d7a-5227-48ce-8d3d-268791bd5521/node_modules/.registry.npmjs.org/express/4.17.1/node_modules/express/lib/router/layer.js:95:5)

Answer 1

您可以尝试在全局范围内使用全局变量，即在关闭之前声明它。这不是一个“干净”的解决方案，但最容易尝试查看其余代码是否正常工作的解决方案。

var globalData = {

  finalpoints: 0,

  finalcosts: 0

};

$(function(){ 

 globalData.finalpoints = points;

 globalData.finalcosts = costammount;

});

进而：

(function( detail, $, undefined, index) {

    'use strict';

    var fd= globalData;

})(fd, jQuery);

您还可以声明一些全局函数，并从外部文件调用它，而不是直接访问变量，以获取您需要的值。这样你就可以返回一个带有数据的对象，并在需要时向它添加/删除更多数据。

function getFinalData() {

  return [globalData.finalpoints, globalData.finalcosts];

}

或者干脆不包装内联数据并且不使用全局变量：

function getFinalData() {

  var finalpoints = points;

  var finalcosts = costammount;

  return [finalpoints, finalcosts];

}

进而：

(function( detail, $, undefined, index) {

    'use strict';

    var fd= getFinalData();

})(fd, jQuery);

之后，您可以尝试一些消息传递解决方案，如自定义事件（https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events），或一些全局数据存储库，甚至https:/ /developer.mozilla.org/en-US/docs/Web/API/Window/localStorage（或 sessionStorage）等...取决于运行外部文件的范围和/或必须传递数据的频率。

请记住，内联代码必须在来自外部文件的代码之前运行，即在包含其他脚本之前将其内联。