js中的width问题
1、在jQuery中,width()方法用于获得元素宽度;
innerWidth()方法用于获得包括内边界(padding)的元素宽度,
outerWidth()方法用于获得包括内边界(padding)和边框(border)的元素宽度,如果outerWidth()方法的参数为true则外边界(margin)也会被包括进来,即获得包括外边框(margin)、内边界(padding)和边框(border)的元素宽度。
同理,innerHeight方法与outerHeight方法也是用同样的方法计算相应的高度。
width()<=innerWidth()<=outerWidth()<=outerWidth(true); <script type="text/javascript">
$(document).ready(function(){
$(".btn1").click(function(){
var obj=$("#p_obj");
alert(obj.width());
alert(obj.innerWidth());
alert(obj.outerWidth());
alert(obj.outerWidth(true));
});
});
</script>
输出的结果是:200,220,240,260. <p id="p_obj" style=" width:200px; padding:10px; border:10px solid blue; margin:10px;">This is a paragraph.</p>
<button class="btn1">输出高度</button>
js中的width问题的更多相关文章
- JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义
JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...
- js中获取css的样式
因为给定一个div宽度或者其他样式之后,再设置一个border的宽度在js中得到的obj.setoffWidth就会变成width加上border的二倍宽度,因此可以自己写一个方法来获取样式.(obj ...
- Chart.js中文文档-雷达图
雷达图或蛛网图(Radar chart) 简介 A radar chart is a way of showing multiple data points and the variation bet ...
- js中getBoundingClientRect的作用及兼容方案
js中getBoundingClientRect的作用及兼容方案 1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位 ...
- 图解js中常用的判断浏览器窗体、用户屏幕可视区域大小位置的方法
有时我们需要获得浏览器窗口或屏幕的大小.窗口下拉框下拉的距离等数据,对应这些需求,js中提供了不少解决方法,只是数量稍多容易混淆它们各自的意义,下面咱们用图例来解释下12个常见对象属性的作用. 其中有 ...
- js中的遍历foreach,$.each(),$().each()
<!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title></title ...
- js中的preventDefault与stopPropagation详解
本篇文章主要是对js中的preventDefault与stopPropagation进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 首先讲解一下js中preventDefault和stopP ...
- js中的全局变量和静态变量的使用, js 的调试?- 如果js出错, js引擎 就会停止, 这会 导致 后面的 html中 refer 该函数时, 会报错 函数为定义!!
效果里面的函数, 如show, hide,slideDown等, 这些都叫 "效果"函数, 但是里面可以包含动画, 也可以 不包含动画. 动画,是指 元素 的内容 是 逐渐 显示/ ...
- 关于JS中的JSON
早期,一般是使用XML作为互联网上传输结构化数据的,但由于它解析麻烦,字符冗长,因此被轻量级的JSON所逐渐替代.JSON是JavaScript的一个严格子集,利用了JavaScript中一些模式来表 ...
随机推荐
- VS的一些错误解决方法记录
1.errorC2664 "bool CMarkup::AddElem(MCD_CSTR,MCD_CSTR,int)":不能将参数1从“constchar [7]” 转换位&quo ...
- Laravel 5 Form 和 HTML 的使用
最近在用 laravel 5 做例子,在做到表单的时候,习惯性的使用 Form::open() 结果发现提示错误,没有这个类, 好吧,找了找,发现 在laravel 5 中,把 from 和 html ...
- mysql报错Packet for query is too large (12238 > 1024). You can change this value
今天将项目部署到linux服务器的时候莫名其妙的报一些错误,可是在本地啥错没有,通过实时查看tomcat 的日志之后发现报错是: 实时查看日志: .先切换到:cd usr/local/tomcat5/ ...
- Eclipse 语言文件下载地址
http://www.eclipse.org/babel/downloads.php 更改配色: 安装新软件: http://eclipse-color-theme.github.com/update
- codeforces Gym 101572 I 有向图最小环路径
题目链接 http://codeforces.com/gym/101572 题意 一共n个文件 存在依赖关系 根据给出的依赖关系 判断是否存在循环依赖 ,不存在的话输出SHIP IT,存在的话 ...
- java 使用POI读取excel数据
原文:http://doc.okbase.net/0201zcr/archive/161440.html 一.定义 Apache POI是Apache软件基金会的开放源码函式库,POI提供API给Ja ...
- jQuery.ajax()方法中參数具体解析
前言 在项目开发中,为了实现异步向服务端发起请求,最常常使用的就是jQuery.ajax方法了.刚開始需求比較简单,调用jQuery.ajax方法时要传的參数也就那几个常见的參数:url/data/d ...
- BUPT复试专题—找最小数(2010)
https://www.nowcoder.com/practice/ba91786c4759403992896d859e87a6cd?tpId=67&tqId=29645&rp=0&a ...
- leetcode Valid Palindrome C++&python 题解
题目描写叙述 Given a string, determine if it is a palindrome, considering only alphanumeric characters and ...
- electron 开发拆坑总结
electron 总结 前言 有一个web项目需要用客户端来包装一下 项目的主要业务都在服务器上 所以项目的大多数功能都用url 地址来访问: 客户端登陆界面在本地 打包客户端的本地登陆界面 做为登陆 ...