JQuery常用CSS操作

JQuery常用CSS操作

  • $(elem).css(obj):设置行内样式
  • $(elem).position():返回相对于父容器位置,只能获取不能设置
  • $(elem).offset(obj):返回相对于页面左上角位置,既能获取也能设置
  • $(elem).scrollTop(num):返回滚动条位置,设置滚动条位置
  • $(elem).width(num):设置宽度,获取宽度
  • $(elem).height("50px"):设置高度,获取高度
  • $(elem).addClass(className1 className2):添加class
  • $(elem).removeClass(className1 className2):删除class
  • $(this).toggleClass("div1",bool):开关切换,true可以,false不行

toogleClass给div添加/删除名为div1的class

 $("div").addClass("div0").click(function(){
                $(this).toggleClass("div1");//可以开关切换
                // $(this).toggleClass("div1",true);//只可以切换过来
                // $(this).toggleClass("div1",false);//不能切换
            }) 

 获取宽高:

  • $(elem).width(num):获取/设置宽度(无参时返回高度,否则返回JQ对象)
  • $(elem).height(num):获取/设置高度(无参时返回高度,否则返回JQ对象)
  • $(elem).innerWidth(num):获取/设置padding+content(无参返回宽,否则返回JQ对象)
  • $(elem).innerHeight(num):获取/设置padding+content(无参返回高,否则返回JQ对象)
  • $(elem).outerWidth(para):无参获取content+margin+padding,参为数值设置outerWidth,参为true获取占位宽(content+padding+margin+border)

猜你喜欢

转载自www.cnblogs.com/ltfxy/p/12332257.html