不使用全局变量将数据发送到JS文件

Question

我需要将HTML页面中的数据发送到该页面中加载的脚本文件。我能想到的最简单的方法是使用一个全局变量，该变量在页面中定义并在脚本文件中访问。

我们都知道全局状态不好，所以我开始考虑可用于将数据从HTML页面传递到脚本文件而不使用全局状态的选项。我找不到（或想到）任何。

我很好奇这是否可行。有什么想法吗？

Answer 1

这取决于你在做什么。一般来说，我不会建议这种方法，但根据您的具体情况需要考虑。为了这个例子，我假设您正在使用jQuery（如果没有，请将document.ready替换为您想要用于onDOMReadyStateChange监视的任何内容）。

在HTML中：

<script type='text/json-data' id='some_data_set'>
  { 'foo': 'bar', 'baz': 1 }
</script>

在JavaScript中：

$(function() {
  var myData = JSON.parse($('script#some_data_set').html());
  // YOUR CODE GOES HERE
});

Answer 2

不。所有javascript范围都从全局级别开始，因此您必须至少一个全局引用您的数据。

假设您想存储产品和事件列表：

var myGlobalData = { "products":<products>, "events":<events> };

<products>和<events>是两个不同的数据块。

---

如果你对全局对象有偏执，你可以在完成使用后删除参考点（因此它的内容），如下所示：

delete window.myGlobalData;

Answer 3

一种选择是确定数据的范围。例如，在JS文件中，您可以定义一个对象，如：

   var processor = { 
     function setData(o) { // do stuff
     }  
   };

然后在HTML中，您知道数据的范围是处理器。所以你可以这样做：

processor.setData({someData});