ホームページ > 記事 > ウェブフロントエンド > javascript_javascript スキルで $(function() {}); を書く場合と書かない場合の違いは何ですか?
javascript_javascript スキルで $(function() {}); を書く場合と書かない場合の違いは何ですか?
- WBOYオリジナル
- 2016-05-16 15:46:091175ブラウズ
JavaScript の
$(function() {....}) は jQuery の古典的な使用法であり、 $(document).ready(function() {.. .. }), は、ページが読み込まれてからのみ関数が実行されることを意味します。関数内で DOM を操作する場合は、ページが読み込まれてから実行した方が安全です。 jQueryを使用する場合に非常に一般的です。
$(document).ready() 内のコードは、ページのコンテンツが読み込まれた後に実行されます。コードが script タグに直接記述されている場合は、ページのコンテンツが読み込まれたときに script タグが実行されます。このとき、タグ内で実行されたコードがまだロードされていないコードや dom を呼び出すと、当然ながらエラーが報告されます。ページにアクセスした場合、効果は準備完了と同じになります。
$(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>
JavaScript における (function(){})() の機能と使用法は何ですか
ご本人とは関係ありません
(function(){})() は匿名メソッド
の即時実行を表します
一般に、外部の世界から隔離し、クロージャのような環境を作成し、スコープチェーンを作成し、変数の競合を回避するために使用されます
(function(){
var a;
..........
})()
この記事では、JavaScript で $(function() {}); を書く場合と書かない場合の違いを中心に紹介します。