<!DOCTYPE html>
<html>
<head>
<title>JQueryTets</title>
<script type=
"text/javascript"
src=
"./js/jquery.min.js"
></script>
</head>
<body>
<!--
测试jQuery环境是否OK
使用$(
function
(){js代码});表示网页在加载的过程中执行
下面存在多个以上函数,在网页加载的过程中会分别弹出
"jquery.min.js ready!"
和
"auto load..."
即:一个网页中可以出现多个$(
function
(){js代码}); 它们在网页加载的过程中会按照先后出现的顺序执行
-->
<script type=
"text/javascript"
>
$(
function
(){
});
$(
function
(){
});
</script>
jQuery核心函数:
<!--
jQuery核心函数之一jQuery(expression, [context])
-->
<!--1.第一种情形-->
<div>
<p id=
"h1"
>id为h1的p标签</p>
<p>p标签</p>
</div>
<script type=
"text/javascript"
>
var
plist = $(
"div > p"
);
var
div_p = $(
"div p"
);
</script>
<!--1.第二种情形-->
<form>
<input id=
"text"
type=
"text"
value=
"this is text"
></input><br>
<input type=
"radio"
name=
"city"
>安徽</input>
<input type=
"radio"
name=
"city"
>北京</input>
<input type=
"radio"
name=
"city"
>上海</input>
<input type=
"radio"
name=
"city"
>广东</input>
</form>
<script type=
"text/javascript"
>
var
pInForm = $(
"input:radio"
,document.forms[0]);
var
tInForm = $(
"input:text"
,document.forms[0]);
var
ahInputNode = tInForm.get(0);
</script>
<hr>
<!--
jQuery核心函数之二jQuery(html, [ownerDocument])
-->
<div id=
"hx2"
></div>
<script type=
"text/javascript"
>
$(
"<font color='red'>这是动态添加的font标签</font>"
).appendTo(
"#hx2"
);
</script>
<hr>
<!--
jQuery核心函数之三jQuery(html, props)
-->
<div id=
"hx3"
></div>
<script type=
"text/javascript"
>
$(
"<div>"
,{
text:
"click me"
,
click:
function
(){
alert(
"click!"
)
}
}).appendTo(
"#hx3"
);
</script>
<br>
<!--
jQuery核心函数之四jQuery(elements)
-->
<div id=
"hx4"
>jQuery核心函数之四jQuery(elements)</div>
<div id=
"hx4d"
onclick=
"hided()"
>点一下就会隐藏</div>
<script type=
"text/javascript"
>
$(
"#hx4"
).css(
"background-color"
,
"gray"
);
function
hided()
{
$(
"#hx4d"
).hide();
}
</script>
<!--
jQuery核心函数之五jQuery()
返回一个空的jQuery对象。
jQuery 1.4中,如果不提供任何参数,则返回一个空jQuery对象。在先前版本中,这会返回一个包含document节点的对象。
-->
<script type=
"text/javascript"
>
var
jQueryObj = $();
</script>
<!--
jQuery核心函数之六jQuery(callback)
$(document).ready()的简写。
允许你绑定一个在DOM文档载入完成后执行的函数。这个函数的作用如同$(document).ready()一样,只不过用这个函数时,需要把页面中所有需要在 DOM 加载完成时执行的$()操作符都包装到其中来。从技术上来说,这个函数是可链接的--但真正以这种方式链接的情况并不多。
-->
<script type=
"text/javascript"
>
$(
function
(){
});
</script>
</body>
</html>