ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery_jqueryの$(function() {});の詳細説明
jQuery_jqueryの$(function() {});の詳細説明
- WBOYオリジナル
- 2016-05-16 15:46:101194ブラウズ
$(document).ready() のコードは、ページのコンテンツが読み込まれた後に実行されます。コードが script タグに直接記述されている場合、script タグ内のコードはページの読み込み時に実行されます。今回は、タグ内で実行されたコードがまだロードされていないコードまたは DOM を呼び出した場合、エラーが報告されます。もちろん、script タグをページの最後に配置しても問題はありません。効果は準備完了と同じです。
$(document).ready(function(){}) は $(function(){});
と省略できます。段落をクリックすると、この段落は非表示になります:
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
</html>
$(document).ready(function() {}) が削除された場合、段落を非表示にすることはできません:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("p").click(function(){
$(this).hide();
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
</html>
しかし、ページの最後にスクリプトを置くと、隠された効果を復元できます:
<html>
<head>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$("p").click(function(){
$(this).hide();
});
</script>
</html>
概要:
$(document).ready 内のコードは、ページのコンテンツが読み込まれた後に実行されます。ページが読み込まれると、script タグによって内部のコードが実行されます。コードがまだロードされていないコードまたは DOM を呼び出すと、エラーが報告されます。
もちろん、script タグをページの最後に配置しても問題はなく、準備完了と同様の効果が得られます
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。