前言:

以前,当然包括现在的大部分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. VS快捷键失效问题

    VS作为宇宙最强IDE,为我们提供了强大的快捷键组合,熟练的使用这些快捷键能极大提高我们的编码效率,但是在我们实际使用的过程中经常会遇到某个快捷键组合失效的问题. 问题原因: 一般都是VS的快捷键与电 ...

  2. 在MFC Dialog中显示cmd窗口

    打开Project -> Properties,在Build Events -> Post-Build Event里的Command Line中输入: editbin /SUBSYSTEM ...

  3. windowsserver2016系统性能和功能对比介绍

    一. 性能和可扩性  特征描述 Windows Server 2012/2012 R2  标准版和数据中心 Windows Server 2016  标准版和数据中心 物理内存(主机)支持 每个物理服 ...

  4. Java入门(一):Hello World !

    前言 从今天开始,准备写Java Web开发的系列文章,毕竟自己主攻的还是Java方向,Python只是业余学习的兴趣使然,在第二技能还没有培养成熟前,做好第一技能的巩固和提高是很有必要的.从正式入行 ...

  5. Servlet(一):Hello Servlet

    今天介绍的专题是servlet和jsp,属于web开发中的基础,先来实际操作一下servlet,创建你的第一个web小项目. 1.新建一个maven项目. 鼠标右键单击eclipse左边项目栏的空白区 ...

  6. [福大软工] Z班 第12次成绩排行榜

    注:本次成绩排行榜是针对结对项目二的点评分数 作业要求 http://www.cnblogs.com/easteast/p/7604534.html 评分细则 (1)有贴生成得最"好&quo ...

  7. 设计模式のFilterPattern(过滤器模式)----结构模式

    一.产生背景 我们有一堆“人”的对象,我们应该怎么选择出其中的男性.女性或者其他类型的呢?这时候我们可以用过滤器模式 二.通常做法 我们将创建一个 Person 对象.Criteria 接口和实现了该 ...

  8. UVA12558-Efyptian Fractions(HARD version)(迭代加深搜索)

    Problem UVA12558-Efyptian Fractions(HARD version) Accept:187  Submit:3183 Time Limit: 3000 mSec  Pro ...

  9. SDOI2014 R1做题笔记

    SDOI2014 R1做题笔记 经过很久很久的时间,shzr又做完了SDOI2014一轮的题目. 但是我不想写做题笔记(

  10. Oracle的条件in中包含NULL时的处理

    我们在写SQL时经常会用到in条件,如果in包含的值都是非NULL值,那么没有特殊的,但是如果in中的值包含null值(比如in后面跟一个子查询,子查询返回的结果有NULL值),Oracle又会怎么处 ...