JavaScript Modules Full (ok)

https://www.w3schools.com/js/js_modules.asp

Ví dụ 1:

Fujifilm/gbalb-demo.cybozu.com4913/module.html

<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Modules</h1>
<p id="demo"></p>
<script type="module">
import message from "./message.js";
document.getElementById("demo").innerHTML = message();
</script>
</body>
</html>

Fujifilm/gbalb-demo.cybozu.com4913/message.js

const message = () => {
const name = "Jesse";
const age = 40;
return name + ' is ' + age + 'years old.';
};
export default message;

Ví dụ 2:

Fujifilm/gbalb-demo.cybozu.com4913/module.html

<!DOCTYPE html>
  <head>
  <script type="module">
    import { fnadd, fnsub, value as val } from './modulemath.js';
    import { hello } from './modulehello.js';
    var r1 = document.getElementById('result1');
    r1.innerHTML = "fnadd: " + fnadd(5,5);
    var r2 = document.getElementById('result2');
    r2.innerHTML = "fnsub: " + fnsub(100,5);
    var v = document.getElementById('value');
    v.innerHTML = val
    var h = document.getElementById('hello');
    h.innerHTML = hello("You")
    import * as mmath from  './modulemath.js';
    localStorage.radd = mmath.fnadd(5,5);
    localStorage.rsub = mmath.fnsub(100,5);
    localStorage.val = mmath.value;
    document.getElementById('result4').innerHTML = localStorage.radd;
    document.getElementById('result5').innerHTML = localStorage.rsub;
    document.getElementById('result6').innerHTML = localStorage.val;
  </script>
  <title>Import Demo</title>
</head>
<body>
  <h1>Import Demo</h1>
    <div id="result1"></div>
    <div id="result2"></div>
    <div id="value"></div>
    <div id="hello"></div>
    <div id="result3"></div>
    <div id="result4"></div>
    <div id="result5"></div>
    <div id="result6"></div>
</body>
</html>

Fujifilm/gbalb-demo.cybozu.com4913/modulemath.js

export var fnadd = function(a, b) {
  return a + b;
}
export var fnsub = function(a, b) {
  return a - b;
}
export var value = 1000;

Last updated

Navigation

Lionel

@Copyright 2023