如何从 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 defined

at /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）等...取决于运行外部文件的范围和/或必须传递数据的频率。请记住，内联代码必须在来自外部文件的代码之前运行，即在包含其他脚本之前将其内联。