【2】初窥jQuery核心$-优快云博客

本文详细解析jQuery中的‘$’符号的含义及其在编写代码中的重要性，通过实例展示了如何使用它来实现基本的DOM操作和事件处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jq中的“$”符号表示什么呢？建议大家不要小看了它哟~~~
因为jQuery 的核心功能都是通过这个函数实现的，以后编写的jQuery代码都是构建在这个函数上的，简单的说，就是都以某种方式在使用它。不过它为什么是个函数呢，明明就一个符号而已啊？

$等同于jQuery
$(document).ready()等同于jQuery(document).ready()

注意上面的区分大小写

======================================================================

下面我们就说说jq的编写形式吧

大多数情况下，jquery代码的编写，都支持下面3种形式

【1】

$(document).ready(function(){
      ........jquery代码...........
});

【2】

$().ready(function(){
      ........jquery代码...........
});

【3】

$(function(){
      ........jquery代码...........
});

在我们日常使用中最常用的是【1】【3】这2种，当然个人比较偏爱第三种，呵呵。

注意：有时候我们自己编写的jquery代码出现莫名其妙的问题，看似正常的代码，但是就是在运行的时候出错了，那么请先检查一下你的代码有没有放在$(document).ready()方法中运行。

=================================================================

说了这么多，现在我们来写一个简单的例子，本来根据写代码的国际惯例，应该的写一个hello world！这样的千篇一律的东西，太坑爹了，但是还是要写下。（说到弹窗，我们一般都是用alert），好了，废话不多说，下面上代码，仔细看哦，这是我们第一个实例代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>实例</title> 
<!-- 引入jQuery -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){                //等待dom元素加载完毕
    alert("Hello World");    //弹出一个框
}); 
</script> 
</head> 
  
<body> 

</body> 
</html>

下面我们在写一个点击出现弹窗的效果（既然是点击出现弹窗效果，那么就会用到这2个【click和alert】，不懂就谷歌、百度吧！具体的还是翻下jq手册）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>实例</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){                           //等待dom元素加载完毕
	$("input").click(function(){   //获取页面中所有input元素，给每一个input元素添加click事件
	    alert("我被点击了！");       //弹出提示框，并显示我被点击了！
    })
})
</script>
</head>

<body>
<input type="submit" value="请点击我"/>
</body>
</html>

ps.要是看不懂的话，我会在下面的教程中讲到。

转载于:https://www.cnblogs.com/huige728/archive/2012/07/26/2610064.html