以下のソースコードでわからない点があります

Writer: admin Type: arte Date: 2019-01-08 00:00
以下のソースコードでわからない点があります。質問1:(javascriptの$(function()とphpの部分)は、いつ実行されるのでしょうか?もちろんアクセスした瞬間というのはわかりますが、どういう条件で実行されるのかわかりません。C言語だったら関数呼び出しがあります。<!DOCTYPE HTML><html lang="ja"><head><meta charset="utf-8"><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script type="text/javascript">$(function() {// 一旦hide()で隠してフェードインさせる$('div#aaa').hide();$('div#bbb').hide();$('#aaa').fadeIn(3000);$('#bbb').fadeIn(6000);});</script><title>タイトル</title><style>div#aaa{text-align:center;}div#bbb{text-align: center;}div#holder{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}</style></head><body><?php$conn = pg_connect("host=localhost port=5432 dbname=test user=test password=test");if (!$conn) {die('接続できませんでした');}echo '接続に成功しました';?><!--<div id="container" style="width: 100%; height: 100%">--><div id="holder"><div id="bbb"><p>BBB</p></div><div id="aaa"><p>AAAEEE</p></div></div><!--</div>--></body></html>共感した0###PHPはサーバーが実行、JavaScriptはブラウザが実行ですので、HTMLをブラウザが受け取る前に、まずサーバー側でこのソースを上から下まで読み込んで、PHPの部分が実行されます。その後、PHP実行後のHTMLがブラウザに渡され、ブラウザは再びソースコードを上から順番に解釈していきます。その中でJavaScriptがあれば、即座に実行されます。$(function () { ... })というのは、DOM構築完了まで処理を遅らせるための書き方です。つまり、「これこれこういう処理を、DOM構築完了まで待って実行する」というスクリプトが、head内の段階で実行されます。もし「DOM構築完了まで待つ」という部分が無かったとすると、body内はまだ読み込まれていませんので、> $('div#aaa').hide();このような箇所で、body内の要素を参照することができません。ナイス0
###もし「DOM構築完了まで待つ」という部分が無かったとして、ページ最後の body 終了タグ直前にjavascriptを書いた場合はbody内の要素を参照できますか?
###BAは悩みました。回答ありがとうございました###$(function()は「DOMツリーの構築が完了したら」、PHPは「その行に到達したら」実行されます。なので今回はアクセス→<head>の中身→<body>の中身(PHP→HTML)→jQueryの順です。(実際は<head>の中身が解析されたタイミングで<script type="text/javascript">が解析されていますが、$(function()の為に実行が待機されます)https://teratail.com/questions/84360https://qiita.com/mimoe/items/74cb3a01a30162759fddこれはブラウザおよびサーバー側で「こうなった時に実行する」と決まっているからです。C言語で「実行時にはまずmain関数を呼ぶ」と決まっているのと一緒です。ナイス0

 

TAG