July 10th, 2020
＃
“nomodule”属性について
“nomodule”属性はモジュールスクリプトに対応する環境でスクリプトを無効化する属性です。
モジュールスクリプトに対応している環境では“nomodule”属性が指定された“script”要素で埋め込まれたスクリプトは実行されません。
“type”属性に“module”を指定した場合、モジュールスクリプトに対応していない環境では不明なMIMEタイプであるためこのスクリプトは無視されます。逆にモジュールスクリプトに対応する環境では“nomodule”属性を指定したスクリプトが無視されるので、このことを利用してモジュールスクリプトとは別に非対応の環境へ向けた代替のスクリプトを用意するために使用することができます。
“nomodule”属性はモジュールスクリプトを埋め込む“script”要素に指定してはいけません。また、この場合は“nomodule”属性は無視されます。
“script”要素の内容がデータブロックの場合は“nomodule”属性を指定してはいけません。
＃
＃
サンプルコード
<!DOCTYPE html>
<html lang="ja">
<head>
<link rel="icon" href="image/favicon.ico">
<meta name="robots" content="index,follow">
<meta name="keywords" content="バナナ,栄養素,産地">
<meta name="description" content="黄色くて栄養満点な果物であるバナナについて解説します。">
<link rel="stylesheet" type="text/css" href="css/stylesheet.css">
<script src="script/script.js" type="module" async></script>
<script src="script/script-alt.js" nomodule async></script>
<title>黄色いフルーツバナナ - 果物を食べる</title>
</head>
<body>
...
