静态页面如何引入js里面的数据
时间: 2024-02-24 16:55:03 浏览: 26
在静态页面中引入JavaScript文件的数据,可以使用全局变量来实现。
首先,在JavaScript文件中定义需要导出的数据,例如:
```js
// data.js
var name = 'Tom';
var age = 18;
```
然后,在静态页面中引入JavaScript文件,并直接使用定义的全局变量来获取需要的数据:
```html
<!-- 引入JavaScript文件 -->
<script src="./data.js"></script>
<script>
// 在页面中使用数据
console.log(name); // 输出:Tom
console.log(age); // 输出:18
</script>
```
需要注意的是,在使用全局变量导出JavaScript文件的数据时,可能会出现变量名冲突的问题。为了避免这种情况,可以将需要导出的数据封装在一个对象中,例如:
```js
// data.js
var myData = {
name: 'Tom',
age: 18
};
```
在静态页面中引入JavaScript文件后,可以通过访问对象属性来获取需要的数据:
```html
<!-- 引入JavaScript文件 -->
<script src="./data.js"></script>
<script>
// 在页面中使用数据
console.log(myData.name); // 输出:Tom
console.log(myData.age); // 输出:18
</script>
```
使用对象封装数据的方式可以有效避免变量名冲突的问题。