jQuery 基础(4)jQuery 尺寸
jQuery 尺寸方法
jQuery 提供多个处理尺寸的重要方法:
width()
height()
innerWidth()
innerHeight()
outerWidth()
outerHeight()
jQuery 尺寸

jQuery width() 和 height() 方法
width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。
height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。
下面的例子返回指定的 <div> 元素的宽度和高度:
实例
$("button").click(function(){ var txt=""; txt+="div 的宽度是: " + $("#div1").width() + "</br>"; txt+="div 的高度是: " + $("#div1").height(); $("#div1").html(txt);});
jQuery innerWidth() 和 innerHeight() 方法
innerWidth() 方法返回元素的宽度(包括内边距)。
innerHeight() 方法返回元素的高度(包括内边距)。
下面的例子返回指定的 <div> 元素的 inner-width/height:
实例
$("button").click(function(){ var txt=""; txt+="div 宽度,包含内边距: " + $("#div1").innerWidth() + "</br>"; txt+="div 高度,包含内边距: " + $("#div1").innerHeight(); $("#div1").html(txt);});
jQuery outerWidth() 和 outerHeight() 方法
outerWidth() 方法返回元素的宽度(包括内边距和边框)。
outerHeight() 方法返回元素的高度(包括内边距和边框)。
下面的例子返回指定的 <div> 元素的 outer-width/height:
实例
$("button").click(function(){ var txt=""; txt+="div 宽度,包含内边距和边框: " + $("#div1").outerWidth() + "</br>"; txt+="div 高度,包含内边距和边框: " + $("#div1").outerHeight(); $("#div1").html(txt);});
jQuery 基础(4)jQuery 尺寸的更多相关文章
- jQuery基础(1) -- jQuery 语法
通过 jQuery,您可以选取(查询,query) HTML 元素,并对它们执行"操作"(actions).jQuery 语法jQuery 语法是通过选取 HTML 元素,并对选取 ...
- JQuery基础知识==jQuery选择器
选择器是jQuery的基础,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器 1. CSS选择器 1.1 CSS是一项出色的技术,它使得网页的结构和表现样式完全分离.利用CSS选择 ...
- jQuery 基础(3) -- jQuery 事件
jQuery 是为事件处理特别设计的.什么是事件?页面对不同访问者的响应叫做事件.事件处理程序指的是当 HTML 中发生某些事件时所调用的方法.实例:在元素上移动鼠标.选取单选按钮点击元素在事件中经常 ...
- jQuery基础(2)-- jQuery 选择器
jQuery 选择器允许您对 HTML 元素组或单个元素进行操作.jQuery 选择器基于元素的 id.类.类型.属性.属性值等"查找"(或选择)HTML 元素. 它基于已经存在的 ...
- 【jquery基础】 jquery.manifest用法:通过后台查询and添加到默认项
今天做一个东西 效果如下: 后台已经保存了006这个SN码,现在需要查到了这个人(杨小婷),然后作为默认值,展示到 manifest 里面 <script> $(document).rea ...
- Jquery | 基础 | 使用 jQuery 表单过滤选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 前端(十七)—— jQuery基础:jQuery的基本使用、JQ功能概括、JS对象与JQ对象转换、Ajax简单应用、轮播图
jQuery的基本使用.JQ功能概括.JS对象与JQ对象转换.Ajax简单应用.轮播图 一.认识jQuery 1.什么是jQuery jQuery是对原生JavaScript二次封装的工具函数集合 j ...
- 0417 jQuery基础知识
jQuery基础知识 jQuery需要引入一个js文件,并且这个文件在所有js代码之前(包括引入的其他js文件) 基础操作(对比js): 1.找标签: js:document.getElement.. ...
- jQuery基础知识总结
1. jQuery基本概念介绍 1.1 什么是jQuery 一个javascript库,把常用方法写到一个js文件中,需要的时候直接调用即可 学习jQuery就是学习一些方法 ...
随机推荐
- promise的学习
为了解决回调地狱的问题,所以出现了promise的设计思想. promise的三种状态: pending 等待状态 resolved 完成状态 rejected 拒绝状态 promise的三种状态,只 ...
- js的浅拷贝和深拷贝
转载:http://www.jb51.net/article/91906.htm //深拷贝,并且把合并后的值放到第二个参数里 function deepCopy(p, c) { var c = c ...
- STL中的next_permutation
给定一个数组a[N],求下一个数组. 2 1 3 4 2 1 4 3 2 3 1 4 2 3 4 1 ..... 在STL中就有这个函数: 1.参数是(数组的第一个元素,数组的末尾),注意这是前闭后开 ...
- optiontransferselect例子
Struts2 OptionTransferSelect标签 动态赋值: 1.html片面: <td class="td2"> <s:optiontransfer ...
- 1018Mysql分表分库
单库单表 单库单表是最常见的数据库设计,例如,有一张用户(user)表放在数据库db中,所有的用户都可以在db库中的user表中查到. 单库多表 随着用户数量的增加,user表的数据量会越来越大,当数 ...
- PHP中错误处理集合
PHP错误处理 错误的分类 通常分3种: 语法错误: 程序运行之前,都要先检查语法.如果语法有错误,就会立即报错,并且不会去执行程序. 运行时错误: 就是在程序语法检查通过后,,开始运行程序并在此过程 ...
- SpringMVC学习--功能完善
简介 在基本的项目中,无非就是基本的增删改查,前面我们已经实现了一个简单的查询功能,现在来实现增删改功能,来了解实际开发中的运用,以修改功能为例,因为修改功能基本覆盖了增加和删除的运用. 前面我们实现 ...
- 使用 screen 管理你的远程会话
文章转载自:https://www.ibm.com/developerworks/cn/linux/l-cn-screen/ 在此只作为笔记使用,不做他用 你是不是经常需要 SSH 或者 telent ...
- js简易日历
js简易日历中设计的知识点:选项卡切换 数组 innerHTML 连接符 与选项卡的区别:div的个数不同 连接符中需要注意的:(优先级) "abc"+12+3+&qu ...
- ASP.NET杂谈-一切都从web.config说起(2)(ConfigSections详解-上 )
ConfigSections的结构 首先我们先回顾一下ConfigSections的结构和它子节点的说明,如下: 1: <configSections> 2: <sectionGro ...