静态页面如何引入js文件里面的数据

在静态页面中引入JavaScript文件的数据，可以使用JavaScript中的模块化机制来实现。

首先，在JavaScript文件中定义需要导出的数据，例如：

// data.js
export const name = 'Tom';
export const age = 18;

然后，在静态页面中引入JavaScript文件，并使用`import`语句来导入需要的数据：

<!-- 引入JavaScript文件 -->
<script src="./data.js"></script>

<script>
// 导入数据
import { name, age } from './data.js';

// 在页面中使用数据
console.log(name); // 输出：Tom
console.log(age); // 输出：18
</script>

需要注意的是，使用`import`语句来导入JavaScript文件的数据需要在支持ES6模块化的浏览器中运行。如果需要在不支持ES6模块化的浏览器中运行，可以使用打包工具（如Webpack）将JavaScript文件打包成支持浏览器运行的文件。

相关问题

如何在静态页面内引入另一个也免得数据

在静态页面内引入另一个静态页面的数据，可以使用JavaScript中的XMLHttpRequest对象（也称为AJAX）来实现。XMLHttpRequest对象可以向服务器发送请求并获取响应数据，从而实现动态加载数据到静态页面中。

首先，在需要获取数据的静态页面中，使用XMLHttpRequest对象向另一个静态页面发送请求，并在获取响应数据后处理数据：

<!-- 需要获取数据的静态页面 -->

<script>
// 创建XMLHttpRequest对象
const xhr = new XMLHttpRequest();

// 发送请求
xhr.open('GET', './data.html');
xhr.send();

// 处理响应数据
xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
    // 获取响应数据
    const data = xhr.responseText;
    
    // 在页面中处理数据
    console.log(data);
  }
}
</script>

然后，在另一个静态页面中定义需要导出的数据，并将数据作为响应数据返回：

<!-- 包含需要导出数据的静态页面 -->

<script>
// 定义需要导出的数据
const name = 'Tom';
const age = 18;

// 将数据作为响应数据返回
document.write(JSON.stringify({ name, age }));
</script>

在上面的例子中，使用`document.write()`函数将需要导出的数据作为响应数据返回。在实际开发中，可以根据需要使用不同的方式将数据作为响应数据返回，例如使用RESTful API、JSON文件等。

需要注意的是，在使用XMLHttpRequest对象时，需要注意跨域问题。如果要从一个域名获取数据，而这个数据源不同于启动页面的域，则需要在响应头中设置CORS（跨域资源共享）。

单页面组件的.vue格式文件，如果在.vue里引入本地静态js文件，请给出具体示例和完整代码

当在.vue文件中引入本地静态js文件时，我们可以使用script标签来引入。下面是一个示例：

<template>
  <div>
    <!-- 页面内容 -->
  </div>
</template>

<script>
import localJs from './local.js'

export default {
  name: 'MyComponent',
  data() {
    return {
      // 数据
    }
  },
  methods: {
    // 方法
  },
  mounted() {
    localJs() // 调用本地js文件中的函数
  }
}
</script>

在这个示例中，我们通过import关键字将local.js文件引入到组件中，并在mounted钩子函数中调用了该文件中的函数。需要注意的是，local.js文件的路径是相对于当前.vue文件的路径。