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. leetcode 349 map

    只需要用map来标记1,今儿通过map的值来得到重叠的部分 class Solution { public: vector<int> intersection(vector<int& ...

  2. 浅谈java内存泄漏

    最近有朋友遇到个问题,tomcat在运行几天后就会报outofmemory,然后就死了,我就稍微总结了下内存泄漏的一些原因,纯属个人理解,欢迎大侠们劈砖: 一.字符串问题 这个也是一个常见的问题,我们 ...

  3. python常用模块详解(一)

    一.简介 模块是一个保存了Python代码的文件.模块能定义函数,类和变量.模块里也能包含可执行的代码 模块分为三种: 自定义模块 内置标准模块 开源模块(第三方) 自定义模块: 模块导入 impor ...

  4. AC日记——凌乱的yyy 洛谷 P1803

    题目背景 快noip了,yyy很紧张! 题目描述 现在各大oj上有n个比赛,每个比赛的开始.结束的时间点是知道的. yyy认为,参加越多的比赛,noip就能考的越好(假的) 所以,他想知道他最多能参加 ...

  5. raspberry pi系统安装

    1.格式化SD卡,用SDFormatter 2.解压下载的操作系统 3.复制操作系统到SD卡(要放在根目录,把最外面的文件夹路径去掉) 4.把SD卡插入raspberry pi,接上电源 5.在启动界 ...

  6. java jvm学习

    在并发编程中,多个线程之间采取什么机制进行通信(信息交换),什么机制进行数据的同步? 在Java语言中,采用的是共享内存模型来实现多线程之间的信息交换和数据同步的. 线程之间通过共享程序公共的状态,通 ...

  7. Java修饰符关键字的顺序

    Java语言规范建议按以下顺序列出修饰符: 1. Annotations 2. public 3. protected 4. private 5. abstract 6. static 7. fina ...

  8. foobar2000设置关闭按钮最小化到系统托盘

    1.设置托盘选项: 2.[File]->[Preferences]->[Advanced]->[Display]->[Default User Interface]->[ ...

  9. mysqldump 把数据库备份到异地的服务器

    原文:http://www.open-open.com/code/view/1420121471484 这个方法可以把通过mysqldump 把本地数据库备份到远端主机, 中间数据的传输通过 ssh ...

  10. android 计时器

    <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=&quo ...