jQuery学习——启动

jQuery

一套简洁、快速、灵活的JavaScript脚本库



jQuery的下载与配置

下载 

官网 点击打开链接 

配置

将下载下来的文件放到项目指定的文件夹中,我直接放在主目录下面。并将下面这句话包含在<head>中

<script language="javascript" src="jquery-1.6.1.min.js"></script>

jQuery工厂函数与事件处理

工厂函数
在jQuery中,无论我们使用哪种类型的选择符都需要从“$“和“()“开始,在()中使用字符串参数
$("div");//用于获取文档中全部<div>

事件处理

页面加载事件
$(document).ready(function(){
//$document,获取整个文档

});

事件绑定
bind() 为元素绑定事件
$("input:button").bind("click",function(){alert("你单击了这个按钮")});
unbind() 移除绑定事件
$("div").one("click",function()
{
alert($(this).text());
});
one() 绑定一次性事件



jQuery选择器

基本选择器
ID选择器
$("#id")
元素选择器
$("element");
类名选择器
以元素具有的CSS类名称查找匹配的元素
$(".class");
复合选择器
复合选择器将多个选择器组合在一起,俩个选择器之间以逗号隔开,只要有一个复合筛选条件,就会被匹配,返回一个集合形式的jQuery对象
$("selector1","selector2","selectorN");
通配符选择器
通配符即*;代表也中的每一个元素。
$("*");//将取得页面上多有的DOM元素集合的jQuery包装集

层级选择器
ancestor descendant选择器
$("ancestor descendant");
eg
$("ul li");//匹配ul元素下的全部li元素
parent>child选择器
用于在给定的父元素下匹配所有的子元素,该选择器只能选择父元素的直接子元素
$("form>child");
prev+next选择器
用于匹配所有紧接在prev元素后的next元素,prev与next是相同级别的元素
$("prev+next");
eg
$("div+img");//匹配<div>标记后的<img>标记
prev~slibings选择器
匹配prev元素之后的所有sliblings元素,同辈元素
eg
$("div~ul");//匹配div元素的同辈元素ul

过滤选择器
简单过滤器
通过以冒号开头,实现简单过滤效果的过滤器
$("tr:first");//匹配表格中的第一个元素
内容过滤器
通过DOM元素包含的文本内容以及是够含有匹配的元素进行筛选
$("li.contains('DOM')");//匹配含有”DOM“文本内的元素
可见性过滤器
利用元素的可见状态匹配元素,visible过滤器,hidden过滤器
表单对象的属性过滤器
通过表单的状态属性匹配元素
$("input:checked");//匹配checked属性为checked的input元素
子元素选择器
$("ul ki:first-child");//匹配ul元素中的第一个子元素li
$("ul li:last-child");//匹配ul元素中最后一个子元素li
表单选择器
<span style="font-weight: normal;">$(":input");//匹配所有的input元素
$("form :input");//匹配<form>标记下的所有<input>元素</span>

你可能感兴趣的:(jquery,dom,表单,脚本)