jQuery 入门教程(18): 操作HTML元素的大小
来源:互联网 发布:客户关系管理的软件 编辑:程序博客网 时间:2024/06/05 02:32
jQuery 提供下面方法来控制HTML元素的大小:
- width()
- height()
- innerWidth()
- innerHeight()
- outerWidth()
- outerHeight()
一般影响HTML元素 大小各部分的示意图如下所示:
jQuery width()和height()方法
width()用来设置或取得元素的宽度,height()设置和取得元素的高度。
下面代码取得<div>元素的高度和宽度。
$("button").click(function(){ var txt=""; txt+="Width: " + $("#div1").width() + "</br>"; txt+="Height: " + $("#div1").height(); $("#div1").html(txt); });
jQuery的innerWidth()和innerHeight()方法
innerWidth() 返回元素包括Padding的宽度,innerHeight()返回包括Padding的高度。
jquery的outerWidth()和 outerHeight()方法
outerWidth()返回包括 padding 和 border的宽度,outerHeight()返回包括padding 和 border的高度。
而outWidth(true)和 outHeight(true) 返回包括padding, border和margin的高度和宽度。
下面的例子设置指定
元素的宽度和高度:
$("button").click(function(){ $("#div1").width(500).height(500); });
- jQuery 入门教程(18): 操作HTML元素的大小
- jQuery 入门教程(18): 操作HTML元素的大小
- 操作HTML元素的大小
- jQuery 入门教程(17): 读写HTML元素的css 属性
- jQuery 入门教程(17): 读写HTML元素的css 属性
- jQuery操作HTML元素
- jquery操作html元素
- jQuery 操作动态加载的html 元素
- jQuery 入门教程(14): 添加HTML元素
- jQuery 入门教程(15): 删除HTML元素
- jQuery 入门教程(14): 添加HTML元素
- jQuery 入门教程(15): 删除HTML元素
- Jquery(第二操作html元素)
- jQuery 操作 html 元素的例子 (input/select/checkbox/radio)
- js & jquery 操作iframe中的HTML元素
- jQuery对象方法操作html元素内容
- jQuery的HTML操作
- 【HTML/JS,JQuery】JQuery操作iframe父页面与子页面的元素与方法
- 建立一个OpenGL ES环境
- linux局域网通信软件iptux,ipmsg
- Android开发之旅:android架构
- (分享) .NET全套金典教材
- (HTML)简单的用户注册界面
- jQuery 入门教程(18): 操作HTML元素的大小
- Google工程师多图详解Android架构
- ADO.NET三个经典案例
- C#(经典)新手项目《骑士飞行棋 》
- 分支定界法 广度搜索定界 深度搜索定界
- [LeetCode]Unique Paths I & II
- (分享)笔记C#基础知识
- 一步一步开发属于自己的SharePoint 2010工作流
- (分享)超详细的常用HTML标签、属性