【備忘録：jQuery】$(function()って何をしているか覚えていたほうがいいよね？
$(function() {・・・・});って何をしているか
結論としては、
・ページが読み込み完了し、DOMの構築が完了した時点でfunction()内が実行される。
ということです。
$(function() {・・・・});を素のjsで書くと
document.addEventListener('DOMContentLoaded', () => {
ここに処理
});
このような感じになります。
また、以下のようにも書けます。
window.addEventListener('load', () => {
ここに処理
});
DOMContentLoadedとloadの違いは？
DOMContentLoaded
これは「DOMの読み込み完了時に発火」ということで、jQueryの$(function() {・・・・});と同等の動きになります。
load
これは「DOMの読み込み完了＋ページ内のリソース（画像等）の読み込み完了時に発火」ということになります。
DOMContentLoadedとloadの使い分けは？
DOMContentLoadedは「DOMの読み込み完了時に発火」なので、ページ表示時、HTML要素に何かをしたければ使用する。
loadは「DOMの読み込み完了＋ページ内のリソース（画像等）の読み込み完了時に」なので、ページ表示時、画像などに何かをしたければ使用する。
と言った使い分けになります。
まとめ
$(function() {・・・・});やDOMContentLoaded、loadは用途により使い分けが必要ですが、基本的には決り文句として覚えておくのが良いかと思います。
appendix
jsファイルに$(function() {・・・・});を書かず、head内でjsファイルを読み込んでいたら、
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="/assets/js/common.js"></script>
<title>Document</title>
</head>
<body>
</body>
</html>
html構築より早くjsファイルが読み込まれるのでjsが動かないです。
Author And Source
この問題について(【備忘録：jQuery】$(function()って何をしているか覚えていたほうがいいよね？), 我々は、より多くの情報をここで見つけました https://qiita.com/hayahayahaya/items/6cae3fb75884437e8559著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .