如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果)

jQuery 属性操作方法(以下方法前些日子学习过,不再赘述)

addClass()

attr()

hasClass()

html()

removeAttr()

removeClass()

toggleClass()

val()

jQuery CSS 操作函数

css()

$("p").css("color");//取得第一个段落的 color 样式属性的值

$(selector).css(name,value)//设置所有匹配元素的指定 CSS 属性

$(selector).css({property:value, property:value, ...})

$(".btn1").click(function(){
$("p").css("color","red");
});

height()

height() 方法返回或设置匹配元素的高度。

$(selector).height()

$(selector).height(length)

$(".btn1").click(function(){
$("p").height(50);
});

offset()

offset() 方法返回或设置匹配元素相对于文档的偏移(位置)

$(selector).offset()
返回第一个匹配元素的偏移坐标。
该方法返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效 $(selector).offset(value) $(".btn1").click(function(){
x=$("p").offset();
$("#span1").text(x.left);
$("#span2").text(x.top);//值对,比如 {top:100,left:0}
});//返回或设置的是一个对象,包含.left和.top属性

offsetParent()

$(selector).offsetParent()//方法返回最近的祖先定位元素

//定位元素指的是元素的 CSS position 属性被设置为 relative、absolute 或 fixed 的元素。
可以通过 jQuery 设置 position,或者通过 CSS 的 position 属性 $("button").click(function(){
$("p").offsetParent().css("background-color","red");
});//设置最近的祖先定位元素的背景颜色

position()

$(selector).position()//position() 方法返回匹配元素相对于父元素的位置(偏移)(类似offset()),此方法只返回不设置
$(".btn1").click(function(){
x=$("p").position();
$("#span1").text(x.left);
$("#span2").text(x.top);
});

scrollLeft()

scrollLeft() 方法返回或设置匹配元素的滚动条的水平位置,滚动条位于最左侧时,位置是 0

$(selector).scrollLeft()//返回第一个匹配元素的水平滚动条位置

$(selector).scrollLeft(position)//设置所有匹配元素的水平滚动条位置

$(".btn1").click(function(){
$("div").scrollLeft(100);
});选择器为导致滚动条出现的元素

scrollTop()

$(selector).scrollTop(offset)//返回或设置

$(".btn1").click(function(){
$("div").scrollLeft(100);
});

width()

$(".btn1").click(function(){
$("p").width(200);
});//width() 方法返回或设置匹配元素的宽度 $(selector).width() $(selector).width(length)

jQuery 属性操作和CSS 操作的更多相关文章

  1. Jquery选择器大全、属性操作、css操作、文档、事件等

    一.简介   定义  jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象  jQuery产 ...

  2. jQuery基础DOM和CSS操作

    $('#box').html();//获取 html 内容$('#box').text();//获取文本内容,会自动清理 html 标签$('#box').html('<em>www.li ...

  3. Jq_文档操作方法、属性操作方法、CSS操作函数

    JQuery文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法                            描述 addClass()      ...

  4. jQuery 效果函数,jquery文档操作,jQuery属性操作方法,jQuerycss操作函数,jQuery参考手册-事件,jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  5. JQuery第三天——CSS操作与JQuery事件

    JQuery的CSS_DOM与样式操作 样式: 获取 class 和设置 class : class 是元素的一个属性, 所以获取 class 和设置 class 都可以使用 attr() 方法来完成 ...

  6. jQuery(基础dom及css操作)

    设置元素内容 元素属性操作 ---------- 元素样式操作 ---------------- 对象数组的遍历 测试代码: $(function () { var v=$('div').css([' ...

  7. jQuery属性遍历、HTML操作

    jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery 遍历函数 jQuery 遍历函数包括了用于筛选.查找和串联元素的方法.    .add() 将元素添加到匹配元素的集合中. . ...

  8. jQuery 第三章 CSS操作

    .css() .attr() .prop() .css() 参数填法:如下所示 ↓  可填px 可不填,注意点:background-color  这类属性,需要填成 小驼峰式  background ...

  9. jQuery CSS 操作

    jQuery CSS 操作 jQuery 拥有三种用于 CSS 操作的重要函数: $(selector).css(name,value) $(selector).css({properties}) $ ...

随机推荐

  1. 浅析Activity不可见与透明

    http://blog.csdn.net/lincyang/article/details/6868582 看见标题也许你会有疑问,不可见和透明不是一个意思吗? 从字面上看,这还真是差不多.但在Act ...

  2. Android - 服务器json数据交互.

    一,服务器端 服务器端使用的是Servlet,封装json对象使用的 'json-lib-2.2.2-jdk15.jar,ezmorph-1.0.4.jar,commons-logging-1.1.j ...

  3. 数据库性能高校:CPU使用过高(下)

    CPU使用率过高的常见原因 查询优化器会尽量从CPU,IO和内存资源成本最小的角度,找到最高效的数据访问方式.如果没有正确的索引,或者写的语句本身就会忽略索引, 又或者不准确的统计信息等情况下,查询计 ...

  4. Oracle学习【索引及触发器】

    索引B_Tree结构 请参照 响应图例 索引是一种允许直接访问数据表中某一数据行的树形结构,为了提高查询效率而引入,是独立于表的对象,可以存放在与表不同的表空间中.索引记录中存有索引关键字和指向表中数 ...

  5. HTML5教程:课时一HTML简介

    一.HTML5新特性 1.HTML5多媒体:标签:视频<video>  :音频<audio> 2.HTML5应用:  本地数据存储:访问本地文件: 本地SQL数据:缓存引用: ...

  6. 交换机access与trunk口

    理论知识: 以太网端口二种链路类型:Access 和Trunk. Access 类型的端口:只能属于1 个VLAN,一般用于连接计算机的端口: Trunk 类型的端口:可以允许多个VLAN 通过,可以 ...

  7. jquery前端性能优化(持续添加。。。)

    1.选择器的使用 (1)$('#id')   使用id来定位dom元素是性能最高的方法.jQuery底层将直接调用本地方法document.getElementById().如果id直接可以找到所要对 ...

  8. 基于page的简单页面推送技术

    我们可以先看下简单效果,打开2个页面可以看到推送效果 服务端我们只需要下面一个方法 using System; using System.Collections.Generic; using Syst ...

  9. vc2010配置opencv2.4.4库(图文 转)

        VC 2010下安装OpenCV2.4.4   说明: 安装平台:32位XP,VS2010: OpenCV 2.4.4不支持VC 6.0: 网上有很多用CMake编译OpenCV的安装教程,这 ...

  10. 【产品体验】ONE一个

    第二篇博客,加油加油~~本人产品新人,学习中,希望大家多多指教!  先来两张ONE的界面图镇楼——        ONE简介: “复杂世界里,一个就够了.”这是一款轻量级的文艺阅读应用,每日更新一张图 ...