1、jQuery常用选择器
筛选:
$('div').has('p'); // 选择包含p元素的div元素
$('div').not('.myClass'); //选择class不等于myClass的div元素
$('div').eq(5); //选择第6个div元素
选择器的转移:
$('#box').prev(); //选择id是box的元素前面紧挨的同辈元素
$('#box').prevAll(); //选择id是box的元素之前所有的同辈元素
$('#box').next(); //选择id是box的元素后面紧挨的同辈元素
$('#box').nextAll(); //选择id是box的元素后面所有的同辈元素
$('#box').parent(); //选择id是box的元素的父元素//通过儿子找爸爸
$('#box').children(); //选择id是box的元素的所有子元素//通过爸爸找儿子(可指定)children('li')
$('#box').siblings(); //选择id是box的元素的同级元素//可以找到同级中的一个(可指定)siblings('li')具有很强的排他性
$('#box').find('.myClass'); //选择id是box的元素内的class等于myClass的元素
.eq 根据下标找元素 与 .index获取元素下标 一般是一起使用
还有一类选择器就是css中的选择器 2、具备jQuery特有的方法
jQuery对象.css()
jQuery对象.addClass()
设置class等属性
jQuery对象.addClass() 添加类名
jQuery对象.removeClass() 删除的是类名中的一个值
jQuery对象.toggleClass() 切换类
特点:在removeClass()中不写参数表示全部删除 3、jQuery动画的实现
1、jQuery对象.animate()
jQuery对象.animate(参数一:要改变的样式属性值,写成字典的形式,参数二:动画持续的时间,单位为毫秒,一般不写单位,
参数三:动画曲线,默认为‘swing’,缓冲运动,还可以设置为‘linear’,匀速运动,参数四:动画回调函数,
动画完成后执行的匿名函数)
2、更便捷的动画实现
jQuery对象.hide() 隐藏
jQuery对象.show() 显示
jQuery对象.toggle() 切换隐藏显示
jQuery对象.fadeIn() 淡入
jQuery对象.fadeOut() 淡出
jQuery对象.fadeToggle() 切换淡入淡出
jQuery对象.slideUp() 卷起
jQuery对象.slideDown() 展开
jQuery对象.slideToggle() 切换卷起展开
jQuery对象.fadeTo(时间,透明度(写成小数)) 设置透明度 4、对元素的操作
jQuery对象.prop("src") 根据src获取src的值
jQuery对象.prop("src","具体的值") 设置src的值
jQuery对象.prop({}) 可以写多个键值对
jQuery对象.val() 把value单独提出来,获取value的值
jQuery对象.val("具体的值") 设置value的值 5、jq中的循环
$('li').each(function(aa){
//形参表示的就是标签的索引值
alert()
})
js中参数非常的随意
获取焦点 focus
失去焦点 blur
拥有更多的时机做事情
进入的子元素或者触发或者不触发命令
推到:标签父子级,命令绑定到父级
hover(function(){},function(){})
进入 移出 6、jQuery对象.submit()提交表单
表单提交不会直接选择form标签选择器html5中一个HTML页面可以有很多个form标签,为了保证一致性都是id的形式选择器
工作中不是直接的提交需要条件判断:如果所有表单控件合法提交否则报错不能提交数据
preventDefault()和return false 都是阻止默认时间的发生 7、事件冒泡:
父子级标签且都绑定相同的事件,触发子级的命令会逐层像父级触发
event.stoppropagation() 和 return false 都是阻止事件冒泡
事件的冒泡是客观存在的现象,不会因为没有响应表示没有冒泡
根据自己的需求来确定在哪return false 阻止冒泡
看不见的遍历是隐式迭代浪费资源
8、事件委托/事件代理:委托给这个标签的父标签
$('ul').delegate(事件实际发生在谁身上,事件属性,匿名函数写命令)
作用:1、提高代码的执行效率
2、可以给未来元素绑定命令
拓展:on(事件属性,匿名函数)只能给未来元素绑定命令
DOM 文档对象模型 document object model
js内置:内置的一个结构化表现手法,通过结构化表现手法把所有标签实现了一个倒置的树状结构图
针对性的寻找标签
标记 == 标签 == 元素 小于 节点(标签,标签的属性,标签的内容)
增加删除
增加标签:子级和同级
删除标签:1、声明变量保存节点标签数据
2、使用追加函数节点变量追加到相应的位置
var $li = $('<li>666</li>')
子级:
$('ul')append($li) 添加到子级之后
$li.appendTo($('ul'))
$('ul').prepend($li) 添加到子级之前
$li.prependTo($('ul'))
同级:
$('ul').after($div) 添加到同级之后
$div.insertAfter($('ul'))
$('ul').before($div) 添加到同级之前
$div.insertBefore($('ul'))
删除:
$('ul').remove() 删除节点
$('ul').empty() 清空节点
$(function(){}) 匿名函数
$('div')选择器
$('<li>666</li>')标签
$(this)原函数 9、$.ajax使用方法
常用参数:
1、url请求地址
2、type请求方式,默认是'GET',常用的还有'POST'
3、dataType设置返回的数据格式,常用的是'json'格式,也可以设置为'html '
4、data设置发送给服务器的数据
5、success设置请求成功后的回调函数
6、error设置请求失败后的回调函数
7、async设置是否异步,默认值是'true',表示异步
$.ajax({
url: '/change_data',接口的请求地址接口:为了得到数据的叫接口
type: 'GET',
dataType: 'json',通用数据格式
success:function(dat){
alert(dat.name);
},
error:function(){
alert('服务器超时,请重试!');
}
});

jQuery的一点小结的更多相关文章

  1. 项目常用jquery/easyui函数小结

    #项目常用jquery/easyui函数小结 ##背景 项目中经常需要使用到一些功能,封装.重构.整理后形成代码沉淀,在此进行分享 ##代码 ```javascript /** * @author g ...

  2. JQuery插件使用小结

    JQuery插件使用小结

  3. C++输入一行字符串的一点小结

    C++输入一行字符串的一点小结 原文链接: http://www.wutianqi.com/?p=1181 大家在学习C++编程时.一般在输入方面都是使用的cin. 而cin是使用空白(空格,制表符和 ...

  4. javascript jquery数组操作小结

    ----------------------------------------------------------定义数组-------------------------------------- ...

  5. Jquery操作select小结

    每次操作select都要查资料,干脆总结一下. 为select设置placeholder <select class="form-control selOP" placeho ...

  6. JavaScript自己模仿jQuery的一点小代码

    function seter(sId) {    var obj = document.getElementById(sId);    return new function () {        ...

  7. ExtJS与jQuery的一点细节上的对比

    首先说明这不是一篇完整解读ExtJS和jQuery所有方面差异的文章,只是针对我个人刚看了两天的jQuery产生的一些疑问的整理.之前用过一段时间ExtJS,了解ExtJS的一些机制.现在做移动开发, ...

  8. web一点小结

    1, AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). AJAX 不是新的编程语言,而是一种使用现有标准的新方法. AJAX ...

  9. [转]DevExpress GridControl 关于使用CardView的一点小结

    最近项目里需要显示商品的一系列图片,打算用CardView来显示,由于第一次使用,遇到许多问题,发现网上这方面的资源很少,所以把自己的一点点实际经验小结一下,供自己和大家以后参考. 1.选择CardV ...

随机推荐

  1. WPF 手机验证码 发送按钮倒计时 代码

    private async void SendButton_Click(object sender, RoutedEventArgs e) { var button = sender as Butto ...

  2. Windows access Linux / Ubuntu via Remote Desktop via xrdp

    Windows 多用户远程桌面连接到 Ubuntu / Linux Access Ubuntu from Windows remotely   Follow these steps : Step 1 ...

  3. asp.net mvc +easyui 实现权限管理(一)

    权限是每个企业应用必须的模块,可以简单,也能比较复杂.目前我们公司的权限要求是 能管控页面.字段.按钮.以及数据权限. 正好公司的进销存系统权限模块由我负责.做完后做下记录是个不错的习惯,知识是慢慢积 ...

  4. BadgeView使用

    BadgeView是第三方的插件,用来显示组件上面的标记,起到提醒的作用,下载地址如下:http://files.cnblogs.com/files/hyyweb/android-viewbadger ...

  5. 百度网盘下载器 PanDownload v2.0

    PanDownload是一款坚持以用户体验为中心,畅快淋漓的下载为理念而打造的下载工具. 从2017年2月9日首个版本推出,时至今日已经一年七个月了,首先感谢大家一直以来的支持与建议,促使着我不断地对 ...

  6. Pig distinct用法举例

    dst = distinct data:   DISTINCT只能对整个记录(整行)去重,不能在字段级别去重.   触发reduce阶段   data = load 'data'; distinct ...

  7. ASP.NET Claims-based认证实现认证登录-claims基础知识

    claims-based认证这种方式将认证和授权与登录代码分开,将认证和授权拆分成另外的web服务.活生生的例子就是我们的qq集成登录,未必qq集成登录采用的是claims-based认证这种模式,但 ...

  8. oracle常见的等待事件说明

    转自 http://blog.itpub.net/29371470/viewspace-1063994/ 1. Buffer busy waits 从本质上讲,这个等待事件的产生仅说明了一个会话在等待 ...

  9. win7安装node.js

    最新版本的node.js都已经集成了npm,所以直接从官网下载即可!(不用再配置环境变量) 官网:https://nodejs.org/download/release/latest/ 下载解压即安装 ...

  10. 使用 sar 和 kSar 来发现 Linux 性能瓶颈

    作者: Vivek Gite 译者: LCTT qhwdw | sar 命令用用收集.报告.或者保存 UNIX / Linux 系统的活动信息.它保存选择的计数器到操作系统的 /var/log/sa/ ...