jquery常用方法

JQuery 基本常用方法

$().addClass(css中定义的样式类型);            给某个元素添加样式
$().attr({src:”test.jpg”,alt:”test Image”});         给某个元素添加属性/值
$().html();                                                      获得该元素内的内容(元素,文本等)
$().html(”<b>new stuff</b>”);                        给某元素设置内容
$().addClass(”class”)                                    给某元素添加指定的样式
$().removeClass(”class”)                              给某元素删除指定的样式
$().toggleClass(class)                                  当元素存在参数中的样式的时候取消,如果不存在就设置此样式
$().val();                                                        获取input元素的值
$().val(value);                                               设置input元素的值为value
$().siblings()                                                 获取元素的所有兄弟节点
$().css({})                                                     设置样式

$(”div > p”).css(”border”, “1px solid gray”);  查找所有div的子节点p,添加样式
$.extend(prop)                                             prop是一个jQuery对象,


JQuery Ajax 方法说明

jQuery.get( url, [data], [callback] )   使用GET请求一个页面。
$.get(”test.cgi”, { name: “John”, time: “2pm” }, function(data){
      alert(”Data Loaded: ” + data);
});

jQuery.post( url, [data], [callback], [type] )   使用POST请求一个页面。
ajaxComplete( callback )   当一个AJAX请求结束后,执行一个函数。这是一个Ajax事件
$(”#msg”).ajaxComplete(function(request, settings){
      $(this).append(”<li>Request Complete.</li>”);
});


JQuery Effects 方法说明

show( )                                           显示隐藏的匹配元素。
hide( )                                             隐藏所有的匹配元素。
hide( speed, [callback] )                 以优雅的动画隐藏所有匹配的元素,并在显示完成后可选地触发一个回调函数
toggle( )                                          切换元素的可见状态。如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。
slideDown( speed, [callback] )       通过高度变化(向下增大)来动态地显示所有匹配的元素,在显示完成后可选地触发一个回调函数。这个动画效果只调整元素的高度,可以使匹配的元素以“滑动”的方式显示出来。
slideUp( speed, [callback] )            通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后可选地触发一个回调函数。这个动画 效果只调整元素的高度,可以使匹配的元素以”滑动”的方式隐藏起来。
fadeIn( speed, [callback] )              通过不透明度的变化来实现所有匹配元素的淡入效果,并在动画完成后可选地触发一个回调函数。 这个动画只调整元素的不透明度,也就是说所有匹配的元素的高度和宽度不会发生变化。
fadeOut( speed, [callback] )            通过不透明度的变化来实现所有匹配元素的淡出效果,并在动画完成后可选地触发一个回调函数。 这个动画只调整元素的不透明度,也就是说所有匹配的元素的高度和宽度不会发生变化。
stop( )                                              停止所有匹配元素当前正在运行的动画。如果有动画处于队列当中,他们就会立即开始。
animate( params, [duration], [easing], [callback] )                用于创建自定义动画的函数。
animate( params, options )                                                   创建自定义动画的另一个方法。作用同上。

eq( index )                             从匹配的元素集合中取得一个指定位置的元素,index从0开始。
filter( expr )                            返回与指定表达式匹配的元素集合,可以使用”,”号分割多个expr,用于实现多个条件筛选。
filter( fn )                                利用一个特殊的函数来作为筛选条件移除集合中不匹配的元素。
is( expr )                                 用一个表达式来检查当前选择的元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true。
not( expr )                              从匹配的元素集合中删除与指定的表达式匹配的元素。
slice( start, [end] )                  从匹配元素集合中取得一个子集,和内建的数组的slice方法相同。
children( [expr] )                     取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。可选的过滤器将使这个方法只匹配符合的元素(只包括元素节点,不包括文本节点)。
contents( )                              取得一个包含匹配的元素集合中每一个元素的所有子孙节点的集合(只包括元素节点,不包括文本节点),如果元素为iframe,则取得其中的文档元素。
find( expr )                              搜索所有与指定表达式匹配的元素。
next( [expr] )                           取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。
nextAll( [expr] )                       取得一个包含匹配的元素集合中每一个元素所有的后面同辈元素的元素集合。
parent( [expr] )                        取得一个包含着所有匹配元素的唯一父元素的元素集合。
parents( [expr] )                      取得一个包含着所有匹配元素的唯一祖先元素的元素集合(不包含根元素)。
prev( [expr] )                           取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。
prevAll( [expr] )                       取得一个包含匹配的元素集合中每一个元素的之前所有同辈元素的元素集合。
siblings( [expr] )                      取得一个包含匹配的元素集合中每一个元素的所有同辈元素的元素集合。

 

基本选择器

$(”#myDiv”)                            匹配唯一的具有此id值的元素
$(”div”)                                    匹配指定名称的所有元素
$(”.myClass”)                          匹配具有此class样式值的所有元素
$(”*”)                                        匹配所有元素
$(”div,span,p.myClass”)           联合所有匹配的选择器
css( name )                              访问第一个匹配元素的样式属性。
css( properties )                       把一个”名/值对”对象设置为所有匹配元素的样式属性。
$(”p”).hover(function () {
          $(this).css({ backgroundColor:”yellow”, fontWeight:”bolder” });
}, function () {
        var cssObj = {backgroundColor: “#ddd”,fontWeight: “”,color: “rgb(0,40,244)”}
       $(this).css(cssObj);
});
css( name, value )               在所有匹配的元素中,设置一个样式属性的值。
offset( )                                取得匹配的第一个元素相对于当前可视窗口的位置。返回的对象有2个属性,top和left,属性值为整数。这个函数只能用于可见元素。
var p = $(”p:last”);
var offset = p.offset();
p.html( “left: ” + offset.left + “, top: ” + offset.top );
width( )                        取得当前第一匹配的元素的宽度值,
width( val )                  为每个匹配的元素设置指定的宽度值。
height( )                       取得当前第一匹配的元素的高度值,
height( val )                 为每个匹配的元素设置指定的高度值。
 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
插件简介:使用HTML标签属性,快速实现常用表单验证功能 JQ表单验证插件 使用方法:$.formValidate(options); version:1.6.0 @param {Object} options @param options.area 验证的区域父级元素,默认 body @param options.msg_type 错误提示类型:alert(自定义函数提示) , return(将错误提示直接返回) @param options.msg_func 自定义错误提示调用的函数,填写自定义提示函数名,插件自动传入参数(错误信息以及自定义参数);默认(alert) @param options.focus 移动焦点到错误元素,默认关闭(false) 插件说明:利用 html 标签属性,表单自动验证;支持 为空、正则匹配、函数、非空匹配等验证 html标签属性说明: 1.vf-cate (可选)元素表单类型,可自动验证;支持:text,number,email,hidden,password,textarea,select,date,checkbox,radio 等 2.vf-type (必填)验证类型[可多个,用 "|" 进行分割],支持:empty(为空验证),reg(正则匹配),func(函数调用),item(元素值比较,例如:item:#pwd 或 item:.pwd),length(长度验证,例 length:10 或 length:10-100)以及其他常用类型:mobile,tel,email,url,number,idcard,password,username,gbk 等 3.vf-msg (必填)验证错误提示[可多个,用 "|" 进行分割,顺序与vf_type对应] 4.vf-func (可选)调用验证的函数,当vf-type中包含 func 时,则必填;插件自动传入当前元素的JQ对象 5.vf-reg (可选)正则验证表达式,当vf-type中包含 reg 时,则必填 6.vf-name (可选)验证规则标识。可将当前规则->设置为全局验证规则(名称后加"/g");在同一页面下,可直接多次使用属性 vf-name 调用已有的全局规则,调用全局规则时无需加"/g" 7.vf-null (可选)非空验证:yes/no;开启后,若数据为空,则跳过当前数据验证 注: 1.验证的表单元素,需要添加 class 名 : vf-validate 方开启验证; 2.当使用 vf_func 调用其他验证函数时,会传入“当前元素”;且需要在验证函数中返回验证状态:true(验证成功),其他或false皆为验证失败 * 插件返回值: 1.当 options.msg_type 等于 alert 时:验证成功返回 true , 失败返回 false; 2.当 options.msg_type 等于 return 时:验证成功返回 true , 失败返回 错误信息; 3.当插件发生错误异常,也会直接 return 错误信息。所以判断时,建议以返回true为验证通过,其他皆视为不通过;

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值