【width() innerwidth() outerwidth() css('width')】的更多相关文章

width() innerwidth() outerwidth() css('width')

不多说,用一图足以说明 首先先解释下普通元素和非普通元素, 非普通元素是指window,document这些 元素对象, 普通元素是指除window,document之外的元素,如:div 对于普通的元素 ,他们的作用相同.比如 网页上有一个 div 元素:  <div style="width:200px;height:200px;"></div>我们可以使用:  $(function(){     var width1 = $("div"…

jQuery中【width(),innerWidth(),outerWidth()】

这个问题,已经别扭我多年了,今天终于彻底解决了,拿出来庆贺一下.jquery作为开源项目,无论从思路上,还是从严谨性上,让人崇敬. 随着时间的流逝,jquery的一些功能被逐渐挖掘出来.通过jQuery中[width(),innerWidth(),outerWidth()]这几个方法,我们探索一下网页垂直自适应的方案. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF…

jQuery.width()和jQuery.css('width')的区别

[TOC] 问题描述 使用jQuery修改一个div的宽度时,发现$($0).width('10rem')总是修改成不正确的值,然后使用$($0).css('width', '10rem')时却能正确,简单得查阅了下jQuery文档,发现文档里面对$.fn.width的描述是: val为空时是取得第一个匹配元素当前计算的宽度值(px),val不为空时是设置宽度,可以是字符串或者数字,还可以是一个函数. 刚开始还以为是$.fn.width只支持px,对rem支持不好,后来跟踪了一下源码发现想法错了…

jQuery—一些常见方法（3）【width(),innerWidth(),outerWidth()】

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script src="../../jq-practice/jq/jquery-2.2.1.min.js"></script> <script> $(function(){ aler…

jQuery height() innerHeight() outerHight() width() innerWidth() outerWidth()源码解读

在第二层each,传入的对象以height举例是这样的,{padding:innerHeight,content:height,"":outerHeight} 对它遍历调用function(defaultExtra,funcName),也就是说传入的defaultExtra是键 padding/content/"",而funcName是对应的innerHeight,height,outerHeight. jQuery.fn[funcName]内部有四个分支:1.$(…

jQuery中的width() innerWidth() outerWidth() outerWidth(true)的区别

width()仅仅包括content(内容) innerWidth()包括content(内容)和padding(补白) outerWidth()包括content(内容),padding(补白)和border(边框) outerWidth(true)包括content(内容),padding(补白),border(边框)和margin(边距) 下面是证实代码 <!DOCTYPE html> <html> <head lang="en"> <m…

jquery width(), innerWidth(), outerWidth() 区别

#div1 { width: 100px; height: 100px; border: 5px black solid; padding: 10px; margin: 10px; background: orange; } #div1-son { background: white; width: 100%; height: 100%; } <div id="div1"> <div id="div1-son"></div> &l…

jquery中innerwidth，outerwidth，outerwidth和width的区别

在jQuery中,width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度, outerWidth()方法用于获得包括内边界(padding)和边框(border)的元素宽度, 如果outerWidth()方法的参数为true则外边界(margin)也会被包括进来,即获得包括外边框(margin).内边界(padding)和边框(border)的元素宽度. 同理,innerHeight方法与outerHeight方法也是用同样的方法计算相应…

JQuery .width()/.css("width")方法 比较

1. 获取到的值的区别 获取到的为实际宽度,不包括 内边距 和 边框: <div id="aa"> ...... </div> // 1. width() ---- 得到的值为 具体的数值,如:300,500 ; $("#aa").width( ); // // 2. .css("width"); ---- 得到的值为带px的字符串,如:'300px','500px' ; $("#aa").css(&q…

innerWidth outerWidth

在jQuery中: 一.width()方法用于获得元素宽度: 二.innerWidth()方法用于获得包括内边界(padding)的元素宽度; 三.outerWidth()方法用于获得包括内边界(padding)和边框(border)的元素宽度,如果outerWidth()方法的参数为true则外边界(margin)也会被包括进来,即获得包括外边框(margin).内边界(padding)和边框(border)的元素宽度.同理,innerHeight方法与outerHeight方法也是用同样的方…