Js小知识及一些常见易混淆的知识点

1.offsetleft  =  整数(可以是正,也可以是负数)。如果是浮点数,则始终向下取整

=90px,因为像素里没有小数,自动抛弃整数,表现为向下取整

2.区别
假设:
body{
     height:2000px
  }
function getInfo()
{
var s = "";
s += " 网页可见区域高:"+ document.body.clientHeight;——可见高度是2000px,表示全部可见高度

s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)";

s += " 网页正文全文宽:"+ document.body.scrollWidth;
s += " 网页正文全文高:"+ document.body.scrollHeight;
s += " 网页被卷去的高(ff):"+ document.body.scrollTop;
s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop;
s += " 网页被卷去的左:"+ document.body.scrollLeft;
s += " 网页正文部分上:"+ window.screenTop;
s += " 网页正文部分左:"+ window.screenLeft;
s += " 屏幕分辨率的高:"+ window.screen.height;
s += " 屏幕分辨率的宽:"+ window.screen.width;
s += " 屏幕可用工作区高度:"+ window.screen.availHeight;
s += " 屏幕可用工作区宽度:"+ window.screen.availWidth;
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色";
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸";
}

各种宽度:
1.在css中,网页的盒模型,width:是不包括padding border margin 的
   在js 中,offsetwidth:width+padding+border;
               clientWidth:width + padding(会随着浏览器大小而变化)

所以在js中慎用offsetwidth,因为布局一旦变化,函数就会起变化,而obj.style.width 是单独指css中的宽度;
实例:在运动框架中,border引起div宽度变化非常麻烦

3.js事件
区分鼠标事件:onmouseover(鼠标移入事件) 和 onmouseout (鼠标移出事件)

时间: 2025-01-09 21:37:27

Js小知识及一些常见易混淆的知识点的相关文章

js和java中正则表达式的易混淆点

js中正则表达式的使用 对表单中的值进行正则表达式匹配一般有两种方法: var reg = new RegExp(regStr); reg.test(value); 如下: var reg = new RegExp("\\d{3}"); reg.test("abc123def"); 结果:true 注:new RegExp中传的是正则表达式的字符串,\需要用\转义. str.match(regex);      如"abc123def".matc

软考网络工程师易混淆的知识点汇总

网络工程师考试是全国计算机技术与软件水平考试的一项中级资格考试,通过考试的合格人员能根据应用部门的要求进行网络系统的规划.设计和网络设备的软硬件安装调试工作,能进行网络系统的运行.维护和管理,能高效.可靠.安全地管理网络资源,作为网络专业人员对系统开发进行技术支持和指导,具有工程师的实际工作能力和业务水平,能指导网络管理员从事网络系统的构建和管理工作.网络工程师考试是软考的一大热门,怎样才能顺利通过考试是广大考生都想知道的,下面希赛软考学院为您带来网络工程师备考锦囊之应战篇,专业老师整理的网络工

js小知识分享

HTTP是Hyper Text Transfer Protocol(超文本传输协议)的缩写.它的发展是万维网协会(World Wide Web Consortium)和Internet工作小组IETF(Internet Engineering Task Force)合作的结果,(他们)最终发布了一系列的RFC,RFC 1945定义了HTTP/1.0版本.其中最著名的就是RFC 2616.RFC 2616定义了今天普遍使用的一个版本--HTTP 1.1.为纪念Tim Berners-Lee提出HT

angular.js小知识总结

angular-watch.html 代码如下: <script> var app = angular.module('app',[]); app.controller('ctrl',function($scope){ $scope.init = { price : 20,//单价 count : 5, //数量 money : 3 //运费 }; $scope.a = 0; $scope.$watch('init.count',function(newVal,oldVal){ console

js小知识

1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:document->html->(head,body) 4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document) 5.得到表单中元素的名称和值:document.getElementById("表单中元素的ID号").name(或value) 6.一个小写转大

js小知识 正则表达式的定义

js定义正则表达式有两种方式:普通方式,构造函数方式 正则对象是js的内置对象 正则的属性 正则的方法 js中字符串的方法 一.普通方式(双斜杠//方式):var  reg = /表达式/附加参数 表达式放在双斜杠"//"中,表达式是一个字符串,可以使用特殊字符 附加参数放在第二个斜杠"/"的后秒,是用来扩展表达式的含义,主要有三个参数:g,i,m:g代表可以全局配置:i代表不区分大小写配置:m代表可以多行配置:这三个参数可以任意组合或者不加任何参数: 例如: va

常用JS小知识汇总

1 上传图片:html代码 <input id="image" type='file' name='myFile' size='15' onchange="showPicture(this)" /> <img id="111" src="img/1.jpg" width="133" height="200" /> js代码: <script type=&qu

java基础知识6-- 抽象类,抽象方法,接口,构造方法,类方法等易混淆的知识点

一.抽象类和抽象方法 (B 继承  抽象类A) 抽象类:有抽象方法的一定是抽象类 抽象方法:方法名前有abstract修饰,且方法没有方法体,即{},不需要实现任何功能,只是声明 1.抽象类中的方法有两种: (1)抽象类中的普通方法,可以不必实现 (2)抽象方法,所属的抽象类被继承后,抽象方法必须被重写,除非是被抽象类继承,不必被 抽象类必须被继承,且抽象类不能被实例化,即抽象类A ,不能定义 A a=new A() ; package Interface; /** * Created by w

J2EE中常见易混淆概念

OOAD   Object Oriented Analysis Design,面向对象的分析和设计 JNDI     Java Naming and Directory Interface,Java  命名和目录接口 JTA  Java Transaction API 分布式事务(Distributed Transaction)包括事务管理器(Transaction Manager)和一个或多个支持 XA 协议的资源管理器 ( Resource Manager ) RPC Remote Proc