Jquery 方法大全
一、JQuery常用的方法 :(JQuery中90%都是方法,没有参数是获取,带参数是设置)
$("#id").css('backgroundColor','blue');
.css({'color':'red','width':'300px'}); //不建议.css().css链式编程
.text('改变啦'); //innerText
.html(); //innerHTML
.height()
.width()
.val('改变了'); //value //可以使select、radio、checkbox相应的项被选中
.attr('name'); //取得属性的值
.attr('name','value') //设置name属性
.attr({'title':'TTT','name':'zzz'})
.removeAttr() //删除属性
.addClass('cls') //追加一个类(样式)
.removeClass('cls') //不写参数,则把类全部清除 //移除多个,使用空格隔开
var li=("<li>苹果</li>"); //创建节点
.remove() //删除节点 //返回值,是删除的元素,可以下次再用 //参数为子节点的选取器
.empty() //删除节点(只是清空)
.clone() //复制节点 //.clone(true) 表示复制元素所绑定的事件
.replaceWith("<a href='#'>Test</a>") //将元素替换为指定的对象
.replaceAll("p") //将所有<p>替换为自己
.wrap("<b></b>") //将元素用<b>包裹起来
.wrapAll("p") //将所有匹配元素用自己包裹起来
.wrapInner("p") //将此元素中的内容用<p>包裹起来,不包括自己
.hasClass('cls') //判断是否应用了cls类
.toggle() //隐藏、显示这个元素
.toggleClass('cls') //切换这个cls类(开关灯)
.filter() //筛选元素
.append() //添加元素到此节点中(每个节点)(后置)
.appendTo() //将此节点添加到(参数)的节点中 //可以用来移动元素
.prepend() //添加元素到此节点 (每个节点) (前置)
.prependTo() //
.after() //在此元素之后添加元素(兄弟位置)
.insertAfter() //将此元素添加到(参数)的后面 //在此元素之前添加元素(兄弟位置)
.before() //在每个匹配的元素之前添加元素
.insertBefore() //将此元素(集合)添加到指定元素之前
.children() //取得元素的子元素集合
.is(":visible") //判断
二、动画:
.hide(3000) //隐藏元素(毫秒) //'slow' 'normal' 'fast'
.show() //显示元素(毫秒)
.fadeIn() //淡入(毫秒)
.fadeOut() //淡出(毫秒)
.fadeToggle()
.fadeTo(2000,0.3) //到达透明度多少
.slideUp() //向上收缩隐藏
.slideDown() //向下收缩显示
.slideToggle()
三、 获取兄弟元素的方法 :
.next():之后的第一个兄弟元素 //和+一样
.nextAll():之后的所有兄弟元素
.prev():之前的第一个兄弟元素
.prevAll():之后的所有兄弟元素
.siblings():所有兄弟(除了自己)
.end():返回上一层操作的对象
.first():第一个
.last():最后一个
.closest("li"):查找最近的<li>元素
.find()
.parent()
.parents()
四、CSS操作:
.css('backgroundColor','red')
.css('background-color','red')
.css(backgroundColor,'red')
.css('opacity','0.5') //设置为半透明
.height() //元素的高 没有单位
.width() //元素的宽
.css('height') //有单位,也可能是auto
.offset() //获取元素的offset
.offset.left
.offset.top
.position() //获取相对于最近一个relative或absolute的节点的相对偏移
.position.left
.position.top
.scrollLeft() //获取元素的滚动条距离顶端的距离
.scrollTop(300) //设置距离
五、判断对象是否存在:
if($("#txt").length) {alert('存在');}
if($("#txt")[0]) // Dom:if(document.getElementById('txt') !=null) {}