2015.8.20
JQuery
一、语法的基本结构:
第一步:导入JQuery脚本包
从VS的新建web空网站里的"解决方案资源管理器"-"Scripts文件夹"中找到"jquery-1.7.1.min.js"在界面中打开,右键标签栏选择"打开所在的文件夹",找到"jquery-1.7.1.min.js"先右键复制粘贴到桌面上,然后再从桌面右键复制粘贴到新建空网站中
第二步:写JQuery的ready事件
$(document).ready(function(){
//在这里面写代码
});
注意:
1.JQuery的触发时机---浏览器把页面的HTML加载完毕时触发
2.非侵入性的编码方式
3.链式结构的编码方式
4.集合式操作---操作选择器选择出来的一组对象
二、具体语法
(一)找到元素
选择器的种类:同样式表(CSS3.0)
第一类:基本选择器
1.最最基本的:标签,ID选择器,class选择器
2.组合选择器:空格(后代),逗号(并列),标签名.class(筛选),> (子级选择器)
第二类:过滤选择器
1.基本过滤(按照HTML标记的书写顺序来过滤)
:first---选取第一个
:last---选取最后一个
:eq(索引号)---选取任意一个
:lt(索引号)---选取大于某个索引号的
:gt(索引号)---选取小于某个索引号的
:odd---选取奇数个
:even---选取偶数个
:not(选择器)---排除某几个
2.属性过滤
[属性名]---选择拥有某个属性的元素
[属性名=值]---选取属性名是某个值的
[属性名!=值]---选取属性名不是某个值的
[属性名*=值]---选取属性值中包含某个值的
[属性名^=值]---选取属性名是以某个值开头的
[属性名$=值]---选取属性值以某个值结尾的
3.内容过滤
:has(选择器)---开始与结束标记之间是否包含某类子元素,如果包含就选择出来。
:contains(字符串)---开始与结束标记之间是否包含某段文字,如何包含就选择出来。
<title></title>
<script src="jquery-1.7.1.min.js"></script>
<script language="javascript">
$(document).ready(function(){
alert("hello world");
});//ready()事件,浏览器把页面的HTML加载完毕时触发
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
这是第一句话...
</div>
</form>
</body>
---显示文本并弹出hello world对话框
<title></title>
<script src="jquery-1.7.1.min.js"></script>
<script language="javascript">
alert("JS");
$(document).ready(function(){
alert("hello world");
});//ready()事件,浏览器把页面的HTML加载完毕时触发
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
这是第一句话...
</div>
</form>
</body>
---先弹出JS对话框,再显示文本和弹出hello world对话框
<title></title>
<script src="jquery-1.7.1.min.js"></script>
<script language="javascript">
//ready事件的触发时机:整个HTML文本在浏览器中加载完毕时触发
$(document).ready(function () {
$("#dd").click(function () {
alert("这是非侵入的JS");
});
});//ready()事件,浏览器把页面的HTML加载完毕时触发
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="dd">
这是第一句话...
</div>
</form>
</body>
---显示文本,单击文本弹出"这是非侵入的JS"对话框