前言:

以前,当然包括现在的大部分js引入,我们都是利用<script></script>这种全局的方式进行引入,当然这种弊端还是用的,比如这样直接利用script引入的话,会导致全局暴露,会有变量冲突的可能。

基于此,es6引入了模块引用,具体就是利用import 和 export来进行操作。(当然,大部分后台语言早已经实现了模块引入,甚至包括css这种样式)。

1、那么网页中如何引入js模块呢? 请看下面小案例。

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head> <body>
<script type="module">
import es6 from './es6.js';
let bb = es6.test.start();
console.log(bb);
</script>
</body> </html>

注意:1、type="module"必须要写,否则,目前的浏览器不支持/2、必须要用访问服务器方式打开浏览器,不能直接打开浏览器,否则报错 from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access.

2、被引入的js如何写的呢?请看下面案例。

class Num{
constructor(x,y){
this.x = x;
this.y = y;
}
start(){
return this.x+this.y;
}
}
let test = new Num(2,98980);
export default{
test
}

总结:通过以上两个文件的引用,我们就可以很明晰地了解到es6的模块引入方式怎么使用了。

php,python的模块引入和js有相似之处。但是,貌似只有js的模块被引用时需要export default 这样控制要暴露的接口,这个待后续观看!

es6在网页中模块引入的方法的更多相关文章

  1. 查看python中模块的所有方法

    查看python中模块的所有方法     安装的python模块,现将查看方法总结如下 一.CMD命令行下使用pydoc命令 在命令行下运行$ pydoc modules即可查看 二.在python交 ...

  2. 网页中显示pdf的方法

    非常好的在网页中显示pdf的方法 今天有一需求,要在网页中显示pdf,于是立马开始搜索解决方案,无意中发现一个非常好的解决方法,详见http://blogs.adobe.com/pdfdevjunki ...

  3. .NET混合开发解决方案11 WebView2加载的网页中JS调用C#方法

    系列目录     [已更新最新开发文章,点击查看详细] WebView2控件应用详解系列博客 .NET桌面程序集成Web网页开发的十种解决方案 .NET混合开发解决方案1 WebView2简介 .NE ...

  4. 使用CKplayer插件在网页中嵌入视频的方法(常用笔记2)

    在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...

  5. 非常好的在网页中显示pdf的方法

    今天有一需求,要在网页中显示pdf,于是立马开始搜索解决方案,无意中发现一个非常好的解决方法,详见http://blogs.adobe.com/pdfdevjunkie/web_designers_g ...

  6. 【CKplayer】使用CKplayer插件在网页中嵌入视频的方法

    在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...

  7. 转:HTML网页中插入视频各种方法

    现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...

  8. 【转】HTML网页中插入视频各种方法

    现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...

  9. php include,require 主要是向网页中引入文件

随机推荐

  1. 计数排序与桶排序python实现

    计数排序与桶排序python实现 计数排序 计数排序原理: 找到给定序列的最小值与最大值 创建一个长度为最大值-最小值+1的数组,初始化都为0 然后遍历原序列,并为数组中索引为当前值-最小值的值+1 ...

  2. PowerDesigner 16.5 使用VBScript脚本从Excel导入物理数据模型

    本文使用的数据库类型是Oracle 11g 最近在工作中遇到一个问题:数据的设计以表格的形式保存在Excel文件中.(由于保密原因,我只能看到数据库设计文档,无法访问数据库.=_=!) 其中包括Nam ...

  3. C语言 统计一串字符中空格键、Tab键、回车键、字母、数字及其他字符的个数(Ctrl+Z终止输入)

    //凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ #include<stdio.h> void main(){ , num=, blank=, ...

  4. 【项目 · Wonderland】立项报告

    [软件工程实践 · 团队项目] 第二次作业 团 队 作 业 原 文:http://www.cnblogs.com/andwho/p/7598662.html Part 0 · 简 要 目 录 Part ...

  5. 推酷文章中编写js组件系列文章整理

    一步一步实现JS拖拽插件 http://www.tuicool.com/articles/RBbmMjY JS组件系列——基于Bootstrap Ace模板的菜单和Tab页效果分享 http://ww ...

  6. 【Linux基础】Linux下软件包管理(rpm-deb-yast-yum)

    软件包管理是指系统中一种安装和维护软件的方法.通常软件以包的形式存储在仓库(repository)中,能满足许多人所有需要的软件. 在GNU/Linux(以下简称Linux)操作系统中,RPM和DPK ...

  7. hTML 如何在不同页面上传递参数( 1 )

    (1).一种是重定向跳转,超连<a>就是一种重定向跳转,这样的跳转request对象是传不到下一个页面的,下一个页面得到的request对象是一个新的对象,而不是上一个页面传过来的就得不到 ...

  8. 制作CSS绚烂效果的三种属性

    animation(动画).transition(过渡).transform(变形) https://www.cnblogs.com/shenfangfang/p/5713564.html

  9. Contest Setting 2018 ICPC Pacific Northwest Regional Contest dp

    题目:https://vj.69fa.cn/12703be72f729288b4cced17e2501850?v=1552995458 dp这个题目网上说是dp+离散化这个题目要对这些数字先处理然后进 ...

  10. centos6.5下配置django+uwsgi+nginx

    https://blog.csdn.net/huanbia/article/details/54630180