インラインscriptのdefer, async属性は無効
インラインscriptのdefer, async属性は無効:
以下のように、インラインのscriptにもdefer属性付ければ、headでdefer属性付けたscriptより後に実行してくれること期待したけど、ダメでした。
インラインscriptのdefer, async属性は意味無しだそうです��
https://developer.mozilla.org/ja/docs/Web/HTML/Element/Script#Attributes
おとなしく
以下のように、インラインのscriptにもdefer属性付ければ、headでdefer属性付けたscriptより後に実行してくれること期待したけど、ダメでした。
functions.js
function awesomeFunction (selector) {
document.querySelector(selector).innerHTML = 'awesome!!';
}
<html>
<head>
<script src="functions.js" defer></script>
</head>
<body>
<div id="app"></div>
<script defer>
awesomeFunction('#app');
</script>
</body>
</html>
https://developer.mozilla.org/ja/docs/Web/HTML/Element/Script#Attributes
おとなしく
document.addEventListener('DOMContentLoaded', ...書くしかない<html>
<head>
<script src="functions.js" defer></script>
</head>
<body>
<div id="app"></div>
<script>
document.addEventListener('DOMContentLoaded', function () {
awesomeFunction('#app');
});
</script>
</body>
</html>
コメント
コメントを投稿