关于页面中对象位置的常用js方法
/********************
* 判断某对象是否在显示区域,若不在,则移动滚动条,让其显示
*******************/
function moveToOneMenu(objName)
{
var mendingTop=getObjWZ(objName) //某对象在页面中的位置
var sh=document.body.scrollTop //滚动条离页面最上方距离
var winH=getClientHeight() //窗口高度
if(mendingTop<=0)
return;
if(mendingTop+22-winH-sh > 0) //在下方未显
window.scrollTo(0,mendingTop+22-winH);
else if(mendingTop<sh) //在上方未显
window.scrollTo(0,mendingTop);
}
/********************
* 取某对象在页面中的上下位置:距顶部的距离
*******************/
function getObjWZ(objName)
{
var ob=document.getElementById(objName);
if(!ob){return null;}
var mendingOb = ob;
var mendingTop = mendingOb .offsetTop;
while( mendingOb != null && mendingOb .offsetParent != null && mendingOb .offsetParent.tagName != "BODY" ){
mendingTop += mendingOb .offsetParent.offsetTop;
mendingOb = mendingOb .offsetParent;
}
return mendingTop ;
}
/********************
* 取窗口可视范围的高度
*******************/
function getClientHeight()
{
var clientHeight=0;
if(document.body.clientHeight&&document.documentElement.clientHeight)
{
var clientHeight = (document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}
else
{
var clientHeight = (document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}
return clientHeight;
}
分享到:
相关推荐
javascript中有许多常用的对象和方法,了解这些对象和方法可以帮助我们更好地使用javascript。下面我们将详细介绍这些对象和方法。 一、窗口对象Window Window对象是javascript中的顶级对象,代表浏览器的一个窗口...
以上介绍了几种常用的JavaScript页面跳转方法。不同的方法适用于不同的场景,开发者应根据具体需求选择合适的方法来实现页面跳转功能。值得注意的是,对于废弃的方法(如`window.navigate()`),应避免使用以确保...
在JavaScript中,所有的全局变量和函数都是window对象的属性和方法。本篇将详细阐述window对象的一些常用方法及其作用。 1. **open方法** `window.open(URL, 窗口名称, 窗口风格)` 用于打开新的浏览器窗口。`URL`...
本文将全面探讨JavaScript中的各种刷新页面的方法,并提供实践示例。 1. `location.reload()` 这是最常用的刷新页面的方法,它来自`window.location`对象。`reload()`方法可以接受一个可选参数,用来决定是否强制从...
每个对象都有自己的属性,顶级对象Window是所有其他子对象的父对象,它可以出现在每个页面上,并且可以咋单个JS应用程序中被多次使用。 下表列出了一些Window对象常用属性: 属性 说明 document 对话框中显示...
首先,JavaScript中最常用的延迟执行函数是`setTimeout()`。这个函数可以接受两个参数:一个回调函数和一个时间间隔(以毫秒为单位)。当指定的时间过去后,回调函数会被调用。如果我们想要在延迟后进行页面跳转,...
在JavaScript中,刷新页面是一种常见的操作,特别是在处理多框架页面或者单页面应用时。本文将详细介绍几种使用JavaScript刷新页面的方法,并结合一个具体的示例来解释它们的用法。 1. `window.location.reload()`:...
在JavaScript中,处理用户交互的常见方式之一是利用鼠标事件。以下是一些JS常用的鼠标事件及其对应的方法: 1. `click`:当用户点击元素时触发。常用于按钮、链接等交互元素。 2. `dblclick`:双击元素时触发,通常...
`indexOf()`方法是JavaScript中字符串对象的一个内置方法,用于查找指定子字符串在原字符串中的首次出现位置。其基本语法是`stringObject.indexOf(searchvalue, fromindex)`。这里的`stringObject`是指要搜索的字符...
这些只是JavaScript中常用对象的一部分,还有更多如`Document`(DOM操作)、`Event`(事件处理)等对象,它们共同构建了JavaScript的丰富功能。理解并熟练使用这些对象,是成为一个高效的JavaScript开发者的关键。
以上介绍了 jQuery 中关于页面刷新和 AJAX 方法的使用,以及 JavaScript 中的一些常用知识点。这些基础知识对于 Web 开发者来说非常重要,熟练掌握它们能够帮助开发者更高效地进行前端开发工作。
9. **闭包和作用域**:闭包是JavaScript中一种强大的特性,它可以访问并操作外部函数的变量。理解作用域规则(全局、局部和块级)有助于避免变量冲突和内存泄漏。 10. **异步编程**:包括回调函数、Promise和async/...
这篇内容主要总结了JavaScript中的一些常用对象,包括Math对象和Document对象。 Math对象是JavaScript内置的一个全局对象,提供了许多数学常量和函数。例如,`Math.E`返回自然对数的底数e,`Math.PI`则给出了圆周率...
这种功能可以通过JavaScript中的`history`对象来轻松实现。本文将详细介绍如何使用JavaScript来实现返回历史页面的操作,并深入探讨其背后的原理以及相关的API。 #### 一、`history`对象简介 在浏览器中,`window....
在"JS效果大全(以静态页面展示)"这个压缩包中,我们可以期待找到一系列使用JavaScript实现的视觉效果,这些效果通常通过HTML静态页面来呈现。下面将详细探讨一些可能包含在这些效果中的JavaScript知识点。 1. DOM...
本文将详细介绍 Javascript 中元素位置、大小、鼠标定位操作相关的知识点,包括事件对象、DOM 对象、Style 对象等提供的相关属性和方法。 一、事件对象 Event 事件对象 Event 提供了多个属性来获取鼠标的当前位置...
### JavaScript刷新页面的方法 在Web开发中,有时候我们需要利用JavaScript来实现页面的自动刷新或跳转功能。本文将详细介绍几种常见的使用JavaScript刷新页面的方法,并解释它们的工作原理。 #### 1. 使用`...
尽管在上述内容中提到了“对象常用方法详解”这样的词组,但根据上下文分析,它实际上是文章的标题,而并非具体的知识点。在这里我们忽略了对这四个字的详细解释,因为它们并不符合要求。上述内容已经超过了1000字的...
JavaScript,简称JS,是网页开发中不可或缺的一部分,主要用于实现页面的动态效果和交互性。这里我们来详细探讨一下"页面常用的JS脚本"这一主题,以及如何利用它们提升用户体验。 1. **DOM操作**:JavaScript通过...
在JavaScript中,`Window`对象是所有浏览器窗口的基础。它是全局对象,也是顶级对象。对于初学者来说,了解`Window`对象的基本概念及其方法是非常重要的,这有助于更好地理解浏览器环境中的脚本执行流程。 #### 二...