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. flutter控件之ListView滚动布局

    ListView即滚动列表控件,能将子控件组成可滚动的列表.当你需要排列的子控件超出容器大小,就需要用到滚动块. import 'package:flutter/material.dart'; cla ...

  2. 网络 TCP三次握手及滑动窗口

    三次握手客户端向服务器发出触发请求syn=1:因为这时还没有得到服务器的回应,所以ack=0服务器接收到客户端的触发请求,回复ack=1,表示已经接收到客户端的请求:同时服务器也向客户端发出触发请求, ...

  3. 用unescape反编码得出汉字

    var p="",s="4e00"; for( var i=0;i<255;i++){ p+=unescape(("\\u"+s).r ...

  4. HTML5-入门3。

    CSS选择器. 什么是标签选择器?作用: 根据指定的标签名称, 在当前界面中找到所有该名称的标签, 然后设置属性 格式: 标签名称{ 属性:属性值 } 标签选择器(html中的标签名称) id选择器( ...

  5. 只能在堆上生成的对象 VS. 只能在栈上生成的对象

    1. 只能在堆上 即禁止在栈上生成.如何实现? 当对象建立在栈上面时,是由编译器分配内存空间的,调用构造函数来构造栈对象.如果类的析构函数是私有的,则编译器不会在栈空间上为类对象分配内存. 所以,只需 ...

  6. Jmeter入门--脚本录制

    一.Badboy脚本录制(推荐) 下载地址:http://www.badboy.com.au/download/add,下载完成后直接安装即可. Badboy是一个强大的工具,旨在帮助测试和开发复杂的 ...

  7. word问题

  8. Git修改子模块的路径

    Git在两个地方存储有关子模块的信息.第一个是在一个名为的文件中.gitmodules,该文件被签入git存储库.对此文件的更改将传播到其他存储库. 另一个位置在.git/config,并且它是执行大 ...

  9. springsource-tool-suite插件的在线安装

      1 首先,确定你现在使用的eclipse属于哪个版本? 查看自己的eclipse平台的版本(我的eclipse平台版本是4.3)       2 根据eclipse版本,选择插件的版本 官网:ht ...

  10. 第八章 计时器(DIGCLOCK)

    /*-------------------------------------- DIGCLOCK.C -- Digital Clock (c) Charles Petzold, 1998 ----- ...