jQuery学习笔记(上)_Android, Python及开发编程讨论区_Weblogic技术|Tuxedo技术|中间件技术|Oracle论坛|JAVA论坛|Linux/Unix技术|hadoop论坛_联动北方技术论坛  
网站首页 | 关于我们 | 服务中心 | 经验交流 | 公司荣誉 | 成功案例 | 合作伙伴 | 联系我们 |
联动北方-国内领先的云技术服务提供商
»  游客             当前位置:  论坛首页 »  自由讨论区 »  Android, Python及开发编程讨论区 »
总帖数
1
每页帖数
101/1页1
返回列表
0
发起投票  发起投票 发新帖子
查看: 1947 | 回复: 0   主题: jQuery学习笔记(上)        下一篇 
xpisme
注册用户
等级:少校
经验:1117
发帖:65
精华:0
注册:2015-6-29
状态:离线
发送短消息息给xpisme 加好友    发送短消息息给xpisme 发消息
发表于: IP:您无权察看 2015-9-6 9:40:23 | [全部帖] [楼主帖] 楼主

学习jQuery已经有一个多月了,说来惭愧,对基本事件学了便忘了,原先想好算法进阶也没戏了,路漫漫其修远兮,吾将继续前行!现在先来对这两个月的jQuery进行一个总结吧。
    jQuery是一个优秀的Javascript库,是的,我对jQuery的认识就是这么肤浅,居然一句话就介绍完了,我自己都惊呆了!为什么学jQuery呢?是因为大家都在学嘛,这可是前端的必备技能啊,于是我就慕名前来了,好了,说了这么多废话,要开始干正事了。

一、jQuery
1、下载jQuery库(稳定版:1.9.0版)
2、引入jQuery库,只需在页面页面的<head></head>中加入如下代码:
<script language="javascript" type="text/javascript" src="1.9.0/jquery.js"></script>
二、jQuery基础选择器
1、#id选择器   $(“#id”)
2、element选择器,即选取html标签选择器   $(“element”)
3、.class选择器,即选取类选择器     $(“.class”)
4、*选择器,这个选择器就很牛了,它是用来选取页面里面所有的元素标签,包括html、head、body、script等    $(“*”)  是的,这样就获取了整个页面的所有东西。
5、sele1,sele2,seleN选择器,用来选取多个指定的元素    $(“sele1,sele2,seleN”)  其中的选择器可以是以上列举的每一种,举个例子$(“div,#id,.class”)。
6、层次性选择器之ance desc选择器,当多个元素嵌套在一起时,层次选择器可以帮你速定位某一层次的一个或多个元素。 其中ance desc选择器中使用空格隔开的两个参数,ance参数(ancestor祖先的简写)表示父元素;desc参数(descendant后代的简写)表示后代元素,即包括子元素、孙元素等等。两个参数都可以通过选择器来获取。 $(“ance desc”)
7、层次性选择器之parent>child选择器,此选择器比ance desc选择器的范围要小一点,parent为父元素,child为子元素。 $(“parent>child”)
8、层次性选择器之prev+next选择器,用来获取与“prev”元素紧邻的下一个“next”元素。$(“prev+next”)
9、prev~siblings选择器,用来获取prev元素后面的全部相邻的元素,$(“prev~siblings”),其中参数prev与siblings两者之间通过“~”符号形成一种层次相邻的关系,表明siblings选择器获取的元素都是prev元素之后的同辈元素。
三、jQuery过滤性选择器
    过滤选择器书写以”:”号开头,通常用于查找集合元素中的某一位置的单个元素。
1、:first过滤选择器,查找一组相同标签元素中的第一个元素。   例:$(“li:first”)
2、:eq(index)过滤选择器,获取任意一个标签元素。例: $(“li:eq(3)”)
3、:contains(text)过滤选择器,按照文本内容来查找一个或多个元素。
例:$(“li:contains(‘土豪’)”)
4、:has(selector)过滤选择器,通过元素名称来查找。例:$(“li:has(‘p’)”)
5、:hidden过滤器,获取全部不可见的元素。  $(“p:hidden”)
6、:visible过滤器,与:hidden正好相反,获取全部可见的元素。
7、[attribute=value]属性选择器,获取与属性名和属性值完全相同的全部元素,其中[]是专门用于属性选择器的括号符,参数参数attribute表示属性名称,value参数表示属性值。  
   例:$(“li[title=’我最爱’]”)
8、[attribute!=value]属性选择器,与前一个选择器正好相反,获取不包含属性名,或者与属性名和属性值不相同的全部元素。
9、[attribute*=value]属性选择器,获取属性值中包含指定内容的全部元素。
   例:$(“li:[title*=’最’]”)
10、:irst-child子元素过滤选择器,获取每个父元素中返回的首个子元素,针对于集合。
   例:$(“li:first-child”)
11、:last-child子元素过滤选择器,获取每个父元素返回的最后一个子元素,与上相反。
四、jQuery表单选择器
1、:input表单选择器,返回全部表单元素,不仅包括所有<input>标记的表单元素,而且还包括<textarea>、<select> 和 <button>标记的表单元素。例:$(“#frnTest:input”)
2、:text表单文本选择器,获取表单中全部单行的文本输入框元素,使用较广泛。
例:$(“#frnTest:text”)
3、:password表单密码选择器,获取表单中全部的密码输入文本框元素。
例:$(“#frmTest:password”)
4、:checkbox复选框选择器,快速定位并获取表单中的复选框元素。
例:$(“#frmTest:checkbox”)
5、:radio单选按钮选择器,获取表单中全部单选按钮元素。例:$(“#frmTest:radio”)
6、:submit提交按钮选择器,获取表单中的提交按钮元素。例:$(“#frmTest input:submit”)
7、:image图像域选择器,当input的“type”值为“image”时,该选择器可以获取该类型的全部元素。例:$(“#frmTest:image”)
8、:button表单按钮选择器,获取且只能获取“type”属性值为“button”的<input>和<button>这两类普通按钮元素。例:$(“#frmTest:button”)
9、:checked选中状态选择器,获取处于选中状态的全部元素。例:$(“#frmTest:checked”)
10、:selected选中状态选择器,获取<select>下拉列表框中全部处于选中状态的<option>选项元素。 例:$(“#frmTest:selected”)

    以上就是所有的选择器,今天就先介绍到这了!




赞(0)    操作        顶端 
总帖数
1
每页帖数
101/1页1
返回列表
发新帖子
请输入验证码: 点击刷新验证码
您需要登录后才可以回帖 登录 | 注册
技术讨论