CSS

1.css
<p class="p1">1</p>

$("p").css("color");
获取css属性值
$("p").css("color","red");
添加或修改值
$("p").css({color:"red",margin:"10px"});
添加或修改多个值

2.jQuery.cssHooks

3.offset()
<p class="p1">1</p>

$('.p1').offset({left:'200',top:'200'})
设置元素对当前窗口的相对偏移量
console.log($('.p2').offset().top);
console.log($('.p2').offset().left);
获取偏移量

4.position()
<ul class="ul1">
<li class="li1">1</li>
<li class="li2">2</li>
<li class="li3">3</li>
</ul>

clg($('.li2').position().left)
clg($('.li2').position().top)
获取元素相对于上级元素的偏移量

5.scrollTop()
<body style="height:100px">
<div style="height:200px"></div>
</body>

console.log($('body').scrollTop())
获取body自身滚动条相对于顶部的偏移量
设置div的上级元素body的高小于它，那么为了显示div，body就会自动出现滚动条。
scrollTop()获取的是相对于自身滚动条的偏移量，而不是div的，在此，你要分辨出滚动条来源于谁，不然选错$()对象的话，获取的值永远是0.

6.scrollLeft()
<body style="width:100px">
<div style="width:200px"></div>
</body>

console.log($('body').scrollLeft())
获取body自身滚动条相对于左边的偏移量

6.width()
<div style="width:200px"></div>

console.log($("div").width());
获取元素宽度
console.log($("div").width(100));
设置元素宽度

7.height()
<div style="height:200px"></div>

console.log($("div").height());
获取元素高度
console.log($("div").height(100));
设置元素高度

8.innerWidth()
<div style="width:200px"></div>

console.log($("div").innerWidth());
获取元素内部宽度，这个宽度包括内边距
console.log($("div").innerWidth(100));
设置元素内部宽度，同上

9.innerHeight()
<div style="height:200px"></div>

console.log($("div").innerHeight());
获取元素内部高度，这个高度包括内边距
console.log($("div").innerHeight(100));
设置元素内部高度，同上

10.outerWidth()
<div style="width:200px"></div>

clg($('.div1').outerWidth(100));
设置元素外部宽度，不包括外边距
clg($('.div1').outerWidth());
获取元素外部宽度
clg($('.div1').outerWidth(true));
获取元素外部宽度，包括外边距

10.outerHeight()
<div style="height:200px"></div>

clg($('.div1').outerHeight(100));
设置元素外部高度，不包括外边距
clg($('.div1').outerHeight());
获取元素外部高度
clg($('.div1').outerHeight(true));
获取元素外部高度，包括外边距

jQuery代码节选（css）的更多相关文章

  1. jQuery代码节选（事件）

    事件 1.ready()$(document).ready(function() { //代码});简写:$(function( { //代码});该事件是会在页面加载完后执行,相当于onloca() ...

  2. jQuery代码节选（筛选）

    筛选...8.not()<p class="p1">1</p><p class="p2">2</p><p ...

  3. CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  4. CSS效果：CSS select样式优化 含jquery代码

    CSS 下拉选择菜单基本的CSS样式不怎么好看,通过一些简单的样式优化,可以得到如下图这样的: html结构如下: <div class="sel_wrap"> < ...

  5. 如何书写高质量的jQuery代码

    想必大家对于jQuery这个最流行的javascript类库都不陌生,而且只要是前端开发人员肯定或多或少的使用或者接触过,在今天的这篇文章中,参考了一些资料及实际使用效率,将介绍一些书写高质量jQue ...

  6. 十五个常用的jquery代码段【转】

    好的文章顶一个 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top 2 $('a.t ...

  7. 十五个常用的jquery代码段

    十五个常用的jquery代码段 回到顶部按钮 通过使用 jQuery 中的 animate 和 scrollTop 方法,你无需插件便可创建一个简单地回到顶部动画: 1 // Back to top ...

  8. 经验分享：10个简单实用的 jQuery 代码片段

    尽管各种 JavaScirpt 框架和库层出不穷,jQuery 仍然是 Web 前端开发中最常用的工具库.今天,向大家分享我觉得在网站开发中10个简单实用的 jQuery 代码片段. 您可能感兴趣的相 ...

  9. 50个必备的实用jQuery代码段

    本文会给你们展示50个jquery代码片段,这些代码能够给你的javascript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够帮助 ...

随机推荐

  1. 数据库 之MySQL 简单教程

      So Easy系列之MySQL数据库教程 1.   数据库概述 1.1.  数据库概述 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库,它产生于距今六十多年前,随着信息技术和 ...

  2. Oracle10g 表分区

    1.分区的原因 (1)Tables greater than 2GB should always be considered for partitioning. (2)Tables containin ...

  3. select初始化添加option,通过标签给出回显值，由于回显值和初始化值option中有一个值重复，去重等问题！

    第一张图片: 第二张图片 /** *该方法是为了去重,所谓去重就是 因为回显给select附上了值并设置为selected选中状态,而在我们初始化所有的select添加option元素中于回显的值重复 ...

  4. 不常用的SQL语句记录

    只知道字段名,查询哪些表有该字段:假如字段名为Index select sysobjects.name as tablename,syscolumns.name as columnname from  ...

  5. sh5.while 脚本练习

    脚本编程: 顺序结构 选择结构 if, case 循环结构 for,while,until while循环:适用于循环次数未知的场景 语法: while CONDITION;do statement ...

  6. CSS 清除默认样式

    通常有以下几句就够了: *{margin:0;padding:0} li{list-style:none} img{vertical-align:top;border:none} 如果你想写全也可以: ...

  7. Oracle入门基础

    使用SQLplus工具登录连接 开始->运行CMD-> C:\Users\Admininstrator> sqlplus 请输入用户名:sys@orcl as sysdba 输入口令 ...

  8. 搭建自己的LAMP

    LAMP的搭建说简单也简单,说难也不容易,如果采用一键安装也是比较容易的,但想配置自己需要的版本等等也是比较麻烦.前段时间我分别在自己的电脑和阿里云上部署了Lamp环境,以下是步骤和常出现的问题的解决 ...

  9. mysql 慢查询的小结

    MySQL优化的第一步应该做的就是排查问题,找出瓶颈,而通常情况下的瓶颈和问题都需要通过观察MySQL的运行情况来进行分析,而对于大多数的程序员来说,最容易发现并解决的问题就是MySQL的慢查询或者没 ...

  10. Flashback Data Archive ( Oracle Total Recall ) introduced in 11g

    Flashback Data Archive feature is part of Oracle Total Recall technology. Flashback Data Archive fea ...