JQuery-- 获取元素的宽高、获取浏览器的宽高和垂直滚动距离

1  *  能够使用jQuery设置尺寸
2          *  .width()           width
3          *  .innerWidth()      width + padding
4          *  .outerWidth()      width + padding + border
5          *  .outerWidth(true)  width + padding + border + margin
6          *  能够使用jQuery操作坐标
7          *  .offset() 永远基于网页文档（document）获取
8          *  .position() 基于定位的祖先元素(offsetParent)获取

demo

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <style>
 7         .box{
 8             width: 200px;
 9             height: 200px;
10             background-color: palegreen;
11             padding:20px;
12             border: 10px solid darkcyan;
13             margin: 50px;
14         }
15     </style>
16     <script src="lib/jquery-1.12.2.js"></script>
17
18 </head>
19 <body>
20      <div class="box">
21          width: 200px<br/>
22          height: 200px<br/>
23          padding:20px<br/>
24          border: 10px solid darkcyan<br/>
25          margin: 50px<br/>
26
27      </div>
28 </body>
29 </html>
30 <script>
31     console.log(".css('width')获取盒子宽度=width:"+$('.box').css('width'));
32     console.log("width()获取盒子宽度= width :"+$('.box').width());
33     console.log("innerwidth()获取盒子宽度= width + padding :"+$('.box').innerWidth());
34     console.log("outerWidth()获取盒子宽度=  width + padding + border:"+$('.box').outerWidth());
35     console.log("outerWidth(true)获取盒子宽度= width+ padding + border + margin:"+$('.box').outerWidth(true));
36
37
38
39 </script>

转载于:https://www.cnblogs.com/mrszhou/p/7788372.html

JQuery-- 获取元素的宽高、获取浏览器的宽高和垂直滚动距离相关推荐

Dom基础特殊的节点获取元素节点的内容获取元素的属性 css属性 Dom获取元素的方法
1.Dom基础 <!DOCTYPE html> <html><head><meta charset="utf-8"><titl ...
c#数组获取元素的索引_获取元素集合从C＃中的指定索引
c#数组获取元素的索引 Given a Collection<T> of integer types, and an index, we have to access the elemen ...
节点属性、offset*获取元素尺寸、offsetLeft获取元素定位
1.节点属性节点属性汇总 - nodeType nodeName nodeValue 元素节点 1 大写标签名 null 属性节点 2 属性名属性值文本节点 3 #text 文本内容注释节点 ...
jquery获取元素的值，获取当前对象的父对象等等
jsp代码: <span><input type="hidden" value="1" id="newInfo">& ...
vue获取元素offsetTop，mounted获取不到offsetTop，获取元素距离页面顶边距离
记录一下开发过程中遇到的坑,今天想做一个功能,当我评论完之后,页面跳到评论区顶部,于是就要获取到评论区距离页面顶部的距离,需要循环获取offsetTop来实现,但是在mounted阶段是无论如何都获取 ...
jQuery 超实用笔记（一）- 获取元素
一.利用标签名改变格式原生 javascript 情况下,需要改变标签中内容的属性时需要使用 document.getElementByTagName('标签名') 来编写代码. 而 jQuery ...
详解用Java实现爬虫：HttpClient和Jsoup的介绍及使用(请求方式、请求参数、连接池、解析获取元素)
一.介绍:何为爬虫网络爬虫(Web crawler)也叫做网络机器人可以代替人自动地在互联网中进行数据信息的采集和整理是一种按照一定的规则自动地抓取万维网信息的程序或者脚本可以自动采集所有 ...
使用dom方式遍历文档||获取元素||从元素中获取数据
使用dom方式遍历文档获取元素根据id查询元素getElementById 根据标签获取元素getElementsByTag 根据class获取元素getElementsByClass 根据属性获 ...
js获取元素的方法及具体案例
目录 1. 获取元素的方法 2.补充知识 3.具体案例:变色模块 1. 获取元素的方法 (1)通过id获取:document.getElementByid('id名') 例: <button i ...

JQuery-- 获取元素的宽高、获取浏览器的宽高和垂直滚动距离

demo

JQuery-- 获取元素的宽高、获取浏览器的宽高和垂直滚动距离相关推荐

最新文章

热门文章