プログラミング

【JavaScript】モジュール化 constで変数被るとダメだから・・

投稿日:

type="module" に関して

とりあえず、index.htmlを作ります

今回はスクリプトタグにjavascript全部書くのではなく、type="module"で別ファイルから読み込むところに挑戦してみました。

Static Template

モジュールでの書き方

クレーマー

クレーマーの名前

クレーマーの服装

.jsファイル間(スクリプト間)での変数やり取り

サンプルコードのように importとexportで変数やりとりできます

呼び出す.jsファイル

claimer.jsというファイルを作り、以下をコピペします。

user.jsというファイルを作り、以下をコピペします。

実行すると

コンソールで実行すると、JSONの内容が見れるかと思います

応用編 Jsonデータをクリックするごとに増やしていく

同じく、index.htmlを以下のコードコピペ

index.jsも以下の内容をコピペで作る

実行すると以下のようになります

See the Pen ボタン押すと名前が無限増殖スクリプト by cattleya crispa (@hamankarn) on CodePen.

ここまでのコードを覚えたら、DOM操作でJSON API使えるかなと

人気の記事!

1

ふんわり始まった激アツキャンペーン!なんとアマゾンのスマートスピーカーであるエコードットの第3世代が通常価格5,980円の所、ななななん84%割引の500円で購入できるチャンスです。 ⇩購入は以下の画 ...

2

出典:io-data.jp こんにちは。↑の写真のようなPCモニター環境を目指しています。4K43インチくらいの大きさの4KテレビをMacBook ProのUSB-Cと接続、もしくは、Windowsの ...

3

目次 キャンペーンを駆使!最安を渡り歩くLINEモバイルのキャンペーン楽天モバイルキャンペーンまとめ17ヶ月間の合計スマホ維持費LINEモバイルの口コミ、評判通信速度とりあえずは今の所通信速度は問題な ...

-プログラミング
-,

Copyright© コスパ部 , 2021 All Rights Reserved.