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问题的更多相关文章

  1. JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义

    JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...

  2. js中获取css的样式

    因为给定一个div宽度或者其他样式之后,再设置一个border的宽度在js中得到的obj.setoffWidth就会变成width加上border的二倍宽度,因此可以自己写一个方法来获取样式.(obj ...

  3. Chart.js中文文档-雷达图

    雷达图或蛛网图(Radar chart) 简介 A radar chart is a way of showing multiple data points and the variation bet ...

  4. js中getBoundingClientRect的作用及兼容方案

    js中getBoundingClientRect的作用及兼容方案 1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位 ...

  5. 图解js中常用的判断浏览器窗体、用户屏幕可视区域大小位置的方法

    有时我们需要获得浏览器窗口或屏幕的大小.窗口下拉框下拉的距离等数据,对应这些需求,js中提供了不少解决方法,只是数量稍多容易混淆它们各自的意义,下面咱们用图例来解释下12个常见对象属性的作用. 其中有 ...

  6. js中的遍历foreach,$.each(),$().each()

    <!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title></title ...

  7. js中的preventDefault与stopPropagation详解

    本篇文章主要是对js中的preventDefault与stopPropagation进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 首先讲解一下js中preventDefault和stopP ...

  8. js中的全局变量和静态变量的使用, js 的调试?- 如果js出错, js引擎 就会停止, 这会 导致 后面的 html中 refer 该函数时, 会报错 函数为定义!!

    效果里面的函数, 如show, hide,slideDown等, 这些都叫 "效果"函数, 但是里面可以包含动画, 也可以 不包含动画. 动画,是指 元素 的内容 是 逐渐 显示/ ...

  9. 关于JS中的JSON

    早期,一般是使用XML作为互联网上传输结构化数据的,但由于它解析麻烦,字符冗长,因此被轻量级的JSON所逐渐替代.JSON是JavaScript的一个严格子集,利用了JavaScript中一些模式来表 ...

随机推荐

  1. 625. Minimum Factorization

    Problem statement Given a positive integer a, find the smallest positive integer b whose multiplicat ...

  2. 【单调队列+二分查找】bzoj 1012: [JSOI2008]最大数maxnumber

    [题意] 维护一个单调递减的q数组,用id数组记录q数组的每个下标对应在原数组的位置,那么id数组一定有单调性(q数组中越靠后,原数组中也靠后),然后二分查找这个数 [AC] #include< ...

  3. mybatis配置报错(properties?,settings?,typeAliases?,typeHandlers?,objectFactory?,objectWrapperFactory?,reflectorFactory?,plugins?,environments?,databaseIdProvider?,mappers?)

    如下报错:解决方案:要按照提示的顺序添加属性,(properties?,settings?,typeAliases?,typeHandlers?,objectFactory?,objectWrappe ...

  4. idea打包SpringBoot项目打包成jar包和war

    - 打包成jar包 1. <groupId>com.squpt.springboot</groupId> <artifactId>springbootdemo< ...

  5. Java远程调用BPS流程实现流程运行简单示例

    1.简介:略 2.背景:略 3.目的:自我学习笔记 4.实现过程 (1).画出流程图 如下: 路由活动分支下的条件语句为复杂表达式: ((account<200&&divisio ...

  6. jQuery事件委托之Safari失效的解决办法--摘抄

    什么是事件委托 事件委托是Jquery中一种事件绑定的方式,不同于常见的事件绑定方式将事件绑定在目标元素上,而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数. //常见的事件绑定(Jquery) ...

  7. PHP 之命名空间

    文件A.php namesspace a\b; Class User{ function get_user(){ echo 'this is A Class'; } } 文件B.php namessp ...

  8. 533. Lonely Pixel II

    Given a picture consisting of black and white pixels, and a positive integer N, find the number of b ...

  9. UVA11825 Hackers' Crackdown

    题目描述 PDF 输入输出格式 输入格式: 输出格式: 输入输出样例 输入样例#1: 3 2 1 2 2 0 2 2 0 1 4 1 1 1 0 1 3 1 2 0 输出样例#1: Case 1: 3 ...

  10. winform客户端程序实时读写app.config文件

    新接到需求,wcf客户端程序运行时,能实时修改程序的打印机名称: 使用XmlHelper读写 winform.exe.config文件修改后始终,不能实时读取出来,查询博客园,原来已有大神解释了: 获 ...