网站首页 网站导航 课程中心
新闻中心
您所在的位置:Web前端培训 > 新闻中心 > 【web前端培训】jQuery知识点

【web前端培训】jQuery知识点

来源:中软卓越 日期:2018-05-02 14:29 人气:
标签:
中软国际教育集团Python+大数据课程入驻大武汉啦!!!
1、先讲讲JQuery的概念,JQuery首先是由一个 America 的叫什么 John Resig的人创建的,后来又很多的JS高手也加入了这个团队。其实 JQuery是一个JavaScript的类库,这个类库集合了很多功能方法,利用类库你可以用简单的一些代码实现一些复杂的JS效果。 
 
2、JQuery实现了代码的分离,不用再网页中加入如:onclick之类的事件来调用函数了,直接引入JQuery类库和自己编写的JQuery代码就可以了; 
如: 

$(function(){ 
$("Element").click{ 
function(){ alert("点击我哦!"); 
}); 

上面的代码中 只要定义了Element 这个元素 后面的click是动作 
alert(“点击我哦!”);这个是要执行的代码,当然你可以有很多的操作在这个函数中; 
 
这里面的$这个号代表JQuery的意思 ,就是引用类库了。。。我是这么理解的; 
 
3、JQuery的核心的一些方法 
 
each(callback) ‘就像循环 
 
$(“Element”).length; ‘元素的个数,是个属性 
 
$(“Element”).size(); '也是元素的个数,不过带括号是个方法 
 
$(“Element”).get(); ‘某个元素在页面中的集合,以数组的形式存储 
 
$(“Element”).get(index); '功能和上面的相同,index表示第几个元素,数组的下标 
 
$(“Element”).get().reverse(); ‘把得到的数组方向 
 
$(“Element1″).index($(“Element2″)); '元素2在元素1中的索引值是。。。 
 
4、基本对象获取 
 
$(“*”) ‘表示获取所有对象 
 
$(“#element”) '获得想CSS中的ID号一样 
 
$(“.abc”) ‘所有使用.abc样式的元素 
 
$(“div”) ‘标签选择器 选择所有的div元素 
 
$(“#a,.b,span”) ‘表示获得ID是a的元素和使用了类样式b的元素以及所有的span元素 
 
$(“#a .b p”) ‘ID号是a的并且使用了 b样式的 所有的p元素 
 
5、层级元素获取 
 
$(“Element1 Element2 Element3 ….”) ‘前面父级 后面是子集 
 
$(“div > p”) ‘获取div下面的所有的 p元素 
 
$(“div + p”) ‘div元素后面的第一个 p元素 
 
$(“div ~ p”) ‘div后面的所有的 p元素 
 
6、简单对象获取 
 
$(“Element:first”) ‘HTML页面中某类元素的第一个元素 
 
$(“Element:last”) ‘HTML页面中某类元素的最后一个元素 
 
$(“Element:not(selector)”) ‘去除所有与给定选择器匹配的元素,如:$(“input:not(:checked)”) 表示选择所有没有选中的复选框 
 
$(“Element:even”) ‘获得偶数行 
 
$(“Element:odd“)'获得奇数行 
 
$(“Element:eq(index)”) ‘取得一个给定的索引值 
 
$(“Element:gt(index)”) ‘取得给定索引值的元素 之后的所有元素 
 
$(“Element:lt(index)”) ‘取得给定索引值的元素 之前的所有元素 
 
。。。 
 
7、内容对象的获取和对象可见性 
 
$(“Element:contains(text)”) ‘元素中是否包含text文本内容 
 
$(‘Element:empty”) ‘获得元素不包含子元素或文本的 
 
$(“Element:partnt”) ‘获得元素包含子元素或文本的 
 
$(“Element:has(selector)”) ‘是否包含某个元素, 如:$(“p:has(span)”)表示所有包含span元素的p元素 
 
$(“Element:hidden”) ‘选择所有可见元素 
 
$(“Element:visible”) ‘选择所有不可见元素 
 
8、其他对象获取方法 
 
$(“Element[id]“) ‘所有带有ID属性的元素 
 
$(“Element[attribute = youlika ]” ‘获得所有某个属性为youlika的元素 
 
$(“Element[attribute != youlika ]” ‘获得所有某个属性为不是youlika的元素 
 
$(“Element[attribute ^= youlika ]” ‘获得所有某个属性为不是youlika的开头的元素 
 
$(“Element[attribute $= youlika ]” ‘获得所有某个属性为不是youlika的结尾的元素 
 
$(“Element[attribute *= youlika ]” ‘获得所有某个属性包含youlika的开头的元素 
 
$(“Element[selector1][selector2][....]“) '符合属性选择器,比如$(“input[id][name][value=youlika ]“)表示获得带有ID、Name以及value是youlika 的input元素。 
 
9、子元素的获取 
 
$(“Element:nth-child(index)”) ‘选择父级下面的第n个元素 
 
$(“Element:nth-child(even)”) ‘选择父级下面的偶数 
 
$(“Element:nth-child(odd)”) ‘选择父级下面的奇数 
 
$(“Element:nth-child(3n+1)”) ‘表达式 
 
$(“Element:first-child”) ‘选择父级下面的第一个子元素 
 
$(“Element:last-child”) ‘选择父级下面的最后一个子元素 
 
$(“Element:only-child”) ‘匹配父级下的唯一的一个子级元素,例如dt在dl列表中唯一,那么将选择dt 
 
10、表单对象获取 
 
$(:input)//查找所有的Input元素,当然也包括下拉列表,文本域,单选框,复选框等。 
 
$(:text)//匹配所有的单行文本框 
 
$(:password)//匹配所有的密码框 
 
$(:radio)//匹配所有的单选按钮 
 
$(:checkbox)//匹配所有的复选框 
 
$(:submit)//匹配所有的提交按钮 
 
$(:image)//匹配所有的图像域,例如<input type=”image” /> 
 
$(:reset)//匹配所有的重置按钮 
 
$(:button)//匹配所有的按钮 
 
$(:file)//匹配所有的文件上传域 
 
$(:hidden)//匹配所有的不可见元素或者type为hidden的元素 
 
$(:enabled)//匹配所有可用的input元素,比如radio:enabled表示匹配所有可用的单选按钮 
 
$(:disabled)//匹配所有的不可用input元素,作用与上相反 
 
$(:checked)//匹配所有选中的复选框元素 
 
$(:selected)//匹配所有的下拉列表 
 
11、元素属性的设置与移除 
 
$(“Element”).attr(name) ‘取得第一个匹配的属性值,比如$(“img”).attr(“src”) 
 
$(“Element”.attr(key,value)”) ‘某一个元素设置属性 
 
$(“Element”.attr({key:value,key1:value,….})) ‘为某个元素一次性设置多个属性 
 
$(“Element”).attr(key,function) ‘为所有匹配的元素设置一个计算的属性值。 
 
$(“Element”).removeAttr(name)//移除某一个属性

免责声明:本文转载自网络,转载目的在于传递更多信息,版权归原作者所有,如涉及内容、版权和其它问题请联系我们进行删除。
 

中软卓越是中软国际有限公司投资的大型人才服务机构,是中软国际人才战略的核心组成部分之一,承担集团发展过程中人才储备和培养的任务,是软件及外包业务快速发展的重要人才支撑平台,是集团保持高速增长动力之一。

中软国际教育集团专注IT教育36年,一直秉承“用良心做教育”的理念,是中国移动互联网研发人才一体化服务的开拓者,全力打造移动互联网研发人才服务优质平台。

公司总部位于武汉,目前已在深圳、上海、郑州、广州、大连、武汉、成都、西安、杭州、重庆、长沙、合肥、无锡、南宁、厦门、南京、南昌等全国22个省成立了60多家分公司。拥有全国的移动互联网教学就业保障团队,做到了毕业学员业内高薪水,成为学员信赖的IT培训机构。

营业执照 版权所有©Copyright 2008-2017,武汉中软卓越科技有限公司 , All Rights Reserved. ICP备案号:15018648号-1

sitemap | 来校路线 | 分类导航 | 关于我们