`

关于页面中对象位置的常用js方法

阅读更多
关于页面中对象位置的常用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;   
} 
1
1
分享到:
评论

相关推荐

    javascript常用对象及方法

    javascript中有许多常用的对象和方法,了解这些对象和方法可以帮助我们更好地使用javascript。下面我们将详细介绍这些对象和方法。 一、窗口对象Window Window对象是javascript中的顶级对象,代表浏览器的一个窗口...

    js页面跳转 多种javascript页面中转方法

    以上介绍了几种常用的JavaScript页面跳转方法。不同的方法适用于不同的场景,开发者应根据具体需求选择合适的方法来实现页面跳转功能。值得注意的是,对于废弃的方法(如`window.navigate()`),应避免使用以确保...

    window对象的常用方法和作用

    在JavaScript中,所有的全局变量和函数都是window对象的属性和方法。本篇将详细阐述window对象的一些常用方法及其作用。 1. **open方法** `window.open(URL, 窗口名称, 窗口风格)` 用于打开新的浏览器窗口。`URL`...

    js刷新页面方法大全

    本文将全面探讨JavaScript中的各种刷新页面的方法,并提供实践示例。 1. `location.reload()` 这是最常用的刷新页面的方法,它来自`window.location`对象。`reload()`方法可以接受一个可选参数,用来决定是否强制从...

    JavaScript Window窗口对象属性和使用方法

    每个对象都有自己的属性,顶级对象Window是所有其他子对象的父对象,它可以出现在每个页面上,并且可以咋单个JS应用程序中被多次使用。 下表列出了一些Window对象常用属性: 属性 说明 document 对话框中显示...

    JS 跳转页面延迟方法

    首先,JavaScript中最常用的延迟执行函数是`setTimeout()`。这个函数可以接受两个参数:一个回调函数和一个时间间隔(以毫秒为单位)。当指定的时间过去后,回调函数会被调用。如果我们想要在延迟后进行页面跳转,...

    js刷新页面 方法大全

    在JavaScript中,刷新页面是一种常见的操作,特别是在处理多框架页面或者单页面应用时。本文将详细介绍几种使用JavaScript刷新页面的方法,并结合一个具体的示例来解释它们的用法。 1. `window.location.reload()`:...

    js常用方法(js常用鼠标事件和其对应的方法)

    在JavaScript中,处理用户交互的常见方式之一是利用鼠标事件。以下是一些JS常用的鼠标事件及其对应的方法: 1. `click`:当用户点击元素时触发。常用于按钮、链接等交互元素。 2. `dblclick`:双击元素时触发,通常...

    js常用方法总结

    `indexOf()`方法是JavaScript中字符串对象的一个内置方法,用于查找指定子字符串在原字符串中的首次出现位置。其基本语法是`stringObject.indexOf(searchvalue, fromindex)`。这里的`stringObject`是指要搜索的字符...

    JS常用对象及用法属性的总结(全)

    这些只是JavaScript中常用对象的一部分,还有更多如`Document`(DOM操作)、`Event`(事件处理)等对象,它们共同构建了JavaScript的丰富功能。理解并熟练使用这些对象,是成为一个高效的JavaScript开发者的关键。

    jquery刷新页面和JS常用的函数

    以上介绍了 jQuery 中关于页面刷新和 AJAX 方法的使用,以及 JavaScript 中的一些常用知识点。这些基础知识对于 Web 开发者来说非常重要,熟练掌握它们能够帮助开发者更高效地进行前端开发工作。

    javascript常用方法实例

    9. **闭包和作用域**:闭包是JavaScript中一种强大的特性,它可以访问并操作外部函数的变量。理解作用域规则(全局、局部和块级)有助于避免变量冲突和内存泄漏。 10. **异步编程**:包括回调函数、Promise和async/...

    JavaScript常用对象参考

    这篇内容主要总结了JavaScript中的一些常用对象,包括Math对象和Document对象。 Math对象是JavaScript内置的一个全局对象,提供了许多数学常量和函数。例如,`Math.E`返回自然对数的底数e,`Math.PI`则给出了圆周率...

    js返回一个历史页面

    这种功能可以通过JavaScript中的`history`对象来轻松实现。本文将详细介绍如何使用JavaScript来实现返回历史页面的操作,并深入探讨其背后的原理以及相关的API。 #### 一、`history`对象简介 在浏览器中,`window....

    JS效果大全(以静态页面展示)

    在"JS效果大全(以静态页面展示)"这个压缩包中,我们可以期待找到一系列使用JavaScript实现的视觉效果,这些效果通常通过HTML静态页面来呈现。下面将详细探讨一些可能包含在这些效果中的JavaScript知识点。 1. DOM...

    Javascript元素位置、大小、鼠标定位操作

    本文将详细介绍 Javascript 中元素位置、大小、鼠标定位操作相关的知识点,包括事件对象、DOM 对象、Style 对象等提供的相关属性和方法。 一、事件对象 Event 事件对象 Event 提供了多个属性来获取鼠标的当前位置...

    Javascript刷新页面的几种方法

    ### JavaScript刷新页面的方法 在Web开发中,有时候我们需要利用JavaScript来实现页面的自动刷新或跳转功能。本文将详细介绍几种常见的使用JavaScript刷新页面的方法,并解释它们的工作原理。 #### 1. 使用`...

    JavaScript String 对象常用方法详解

    尽管在上述内容中提到了“对象常用方法详解”这样的词组,但根据上下文分析,它实际上是文章的标题,而并非具体的知识点。在这里我们忽略了对这四个字的详细解释,因为它们并不符合要求。上述内容已经超过了1000字的...

    页面常用的JS脚本小结

    JavaScript,简称JS,是网页开发中不可或缺的一部分,主要用于实现页面的动态效果和交互性。这里我们来详细探讨一下"页面常用的JS脚本"这一主题,以及如何利用它们提升用户体验。 1. **DOM操作**:JavaScript通过...

    javascript window对象

    在JavaScript中,`Window`对象是所有浏览器窗口的基础。它是全局对象,也是顶级对象。对于初学者来说,了解`Window`对象的基本概念及其方法是非常重要的,这有助于更好地理解浏览器环境中的脚本执行流程。 #### 二...

Global site tag (gtag.js) - Google Analytics