`

脚本化文档DOM之一

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body style="padding:50px;margin:0px; height:2000px;border:10px solid red;">
<div id="divs" style="width:240px; height:300px; padding:80px;  border:20px solid red;">
	<div id="div" style="width:200px; height:300px; margin:20px;  border:20px solid red;"></div>
</div>
<script>
var w = document.getElementById("div");
document.writeln("body.offsetWidth:"+document.body.offsetWidth+"=>对象的内Width + 边框<br/>");
document.writeln("body.clientWIdth:"+document.body.clientWidth+"=>对象的内Width<br/>");
document.writeln("div.offsetWidth:"+w.offsetWidth+"=>对象的内Width + 边框<br/>");
document.writeln("div.clientWIdth:"+w.clientWidth+"=>对象的内Width<br/>");
document.writeln("div.offsetLeft:"+w.offsetLeft+" 在IE下包括body的边框,在FF下不包括它的边框<br/>");
document.writeln("div.clientLeft:"+w.clientLeft+"内容与Div边的距离<br/>");
winHeight = document.documentElement.clientHeight; 
winWidth = document.documentElement.clientWidth; 
document.writeln("document.documentElement.clientHeight获取浏览器的Width:"+winWidth+"<br/>");
document.writeln("document.documentElement.clientWidth获取浏览器的Height:"+winHeight+"<br/>");
document.write("获取滚动条的Top:"+document.documentElement.scrollTop+"<br/>");
document.write("获取滚动条的Left:"+document.documentElement.scrollLeft+"<br/>");
document.write("获取滚动条的Width:"+document.documentElement.scrollWidth+"<br/>");
document.write("获取滚动条的height:"+document.documentElement.scrollHeight+"<br/>");
document.write("获取Body的height:"+document.body.offsetHeight+"<br/>");
</script>
</body>
</html>

 

分享到:
评论

相关推荐

    javascript脚本化文档

    Microsoft的IE4引入了一个更全面的DOM,允许对所有元素进行访问和脚本化,甚至允许动态修改文档内容。这两种遗留的DOM在现今的浏览器中仍被保留,尤其是Netscape的0级别DOM,它是W3C标准的一部分。 随着Internet ...

    基于Jscript脚本技术的SVG文档的DOM解析

    综上所述,基于Jscript脚本技术的SVG文档DOM解析技术为动态图形的实现提供了强大的支持。通过结合DOM接口和Jscript脚本,可以高效地操纵SVG文档,实现实时更新和动态展示的功能。这种方法不仅适用于网络化测试系统的...

    DOM4J帮助文档及使用教程

    DOM4J是一个强大的Java库,专门用于处理XML文档。它提供了灵活、高性能的API,使得在Java应用程序中解析、创建、修改和操作XML文档变得容易。DOM4J因其易用性和丰富的功能集,在Java社区中广受欢迎,尤其在处理大型...

    DOM文档对象中文手册

    DOM(Document Object Model)是W3C组织定义的一种标准,它是一种与语言无关的接口,允许程序和脚本动态地访问和更新HTML、XML以及SVG等文档的内容、结构和样式。DOM将整个文档构建成一个树形结构,每个节点代表文档...

    非常实用的DOM文档对象中文手册

    它将文档解析为一个树形结构,每个节点代表文档的一部分,从而允许程序和脚本动态更新、添加、删除和改变元素及属性。DOM文档对象中文手册是一个重要的学习资源,对于理解和操作网页内容具有极大的帮助。 该手册...

    DOM中文文档

    DOM是一种与语言无关的接口,允许程序员和脚本语言(如JavaScript)通过统一的方式来访问和操作文档中的元素、属性和文本。中文DOM文档则为中文使用者提供了更加易懂的解释和示例,以便更好地理解和应用DOM技术。 *...

    文档对象模型(DOM)的帮助文档

    文档对象模型(DOM,Document Object Model)是一种跨平台和语言中立的接口,使得程序和脚本能够动态地访问和更新文档的内容、结构和样式。DOM 主要用于处理 XML 和 HTML 文档,但在本篇文章中我们将聚焦于 XML。 #...

    js dom 文档

    总的来说,JavaScript DOM是前端开发的核心技能之一,它提供了操作网页内容的强大能力。通过理解和熟练使用DOM API,开发者能够构建交互性强、功能丰富的Web应用。而jsdom这样的工具,则将DOM的能力扩展到了服务器端...

    常用手册 DOM文档对象模型.chm

    DOM是W3C(World Wide Web Consortium)制定的一种标准,它为HTML和XML文档提供了一个结构化的表示,并定义了一套标准的编程接口来操作这些文档。 DOM文档对象模型允许开发人员通过JavaScript或其他脚本语言与HTML...

    DOM文档下载

    在Web开发领域,DOM(Document Object Model)是HTML和XML文档的一种标准表示,它将网页内容组织成一个树形结构,允许开发者通过JavaScript或其他脚本语言对页面进行动态操作。DOM文档提供了访问和修改网页内容的...

    DOM文档对象模型中文参考手册.rar

    DOM(Document Object Model)是万维网联盟(W3C)制定的一种标准,它提供了一种结构化的表示XML或HTML文档的方法,并允许编程语言与这些文档进行交互。DOM将整个文档视为一个由节点组成的树形结构,每个节点代表...

    dom dom4j script帮助文档

    DOM将文档解析为一个可操作的对象树,允许开发者通过JavaScript或其他编程语言来访问和修改文档的内容、结构和样式。DOM4J是Java领域中广泛使用的DOM解析器,它提供了更高效和灵活的方式来处理XML文档,包括读取、...

    文档对象模型(DOM)

    文档对象模型(DOM)是Web开发中至关重要的一个部分,它提供了一种标准化的方式来解析、访问和修改HTML或XML文档的结构。DOM将文档视为一棵由节点组成的树,每个节点代表文档的一个部分,如元素、文本、注释等。DOM...

    DOM解析XML文档

    DOM(Document Object Model)是XML和HTML文档的一种标准表示,它提供了一种结构化的表示方法,使得程序可以方便地访问和操作文档中的每一个元素。在本文中,我们将深入探讨DOM解析XML文档的相关知识点,包括DOM的...

    DOM文档对象方法和属性中文文档

    DOM(Document Object Model)是W3C组织定义的一种标准,用于表示XML和HTML文档的结构化接口。DOM将文档解析为一个由节点组成的树形结构,使得开发者可以通过编程方式访问和操作文档的任意部分。本文档集合包含了...

    脚本控制台 甲子版 通过控制台查看目的网页的DOM文档树,执行JavaScript脚本

    2,通过控制台查看目的网页的DOM文档树,执行JavaScript脚本, 界面介绍: 1, 命令历史窗口:保存命令的历史 2, 命令窗口 直接输入javascript语句,如:document.title; 将返回被调试页面的页面标题; ...

    微软的VBS/JS脚本帮助文档

    VBScript,作为微软为Internet Explorer浏览器和Windows操作系统定制的一种脚本语言,主要用于编写动态网页和自动化任务。在ASP中,VBScript经常被用来处理服务器端逻辑,提供与用户交互的能力。这份文档可能涵盖了...

    AJAX文档对象模型DOM

    总结起来,DOM是HTML和XML文档的一种结构化表示,它提供了API来操作文档的每一个部分。无论是添加新的元素,修改现有元素的属性,还是查找特定的元素,DOM都提供了相应的接口。理解并熟练运用DOM是任何Web开发者必备...

Global site tag (gtag.js) - Google Analytics