上一次提到,在报表软件FineReport的JavaScript开发中,可以访问并处理的HTML DOM对象有windows、location、document三种。这次就继续介绍后两种,location和document对象。

Location

Location 对象包含有关当前 URL 的信息。 Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问。

location对象的常用属性

hash         设置或返回从#开始的URL

host          设置或返回主机名和当前URL的端口号

hostname     设置或返回当前URL的主机名

href          设置或返回完整的URL

pathname     设置或返回当前URL的路径部分

port          设置或返回当前URL的端口号

search        设置或返回从?开始的URL(查询部分)

1.location对象的reload()方法

reload()方法用于重新加载当前文档

语法为:

location.reload(false)

如果该方法没有规定参数,或者参数是 false,它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改变,reload() 会再次下载该文档。如果文档未改变,则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。

如果把该方法的参数设置为 true,那么无论文档的最后修改日期是什么,它都会绕过缓存,从服务器上重新下载该文档。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。

Document

每个载入浏览器的HTML 文档都会成为Document对象。Document 对象使我们可以从脚本中对HTML页面中的所有元素进行访问。

Document 对象是 Window 对象的一部分,可通过 window.document 属性对其进行访问

1.document对象的常用属性

cookie      设置或返回当前文档有关的所有cookie

title        返回当前文档的标题

URL        返回当前文档的URL

2.document对象的常用方法

2.1 close()方法

close() 方法可关闭一个由 document.open 方法打开的输出流,并显示选定的数据。语法:

document.close()

该方法将关闭 open() 方法打开的文档流,并强制地显示出所有缓存的输出内容。

如果使用 write() 方法动态地输出一个文档,必须记住这么做的时候要调用 close() 方法,以确保所有文档内容都能显示。

一旦调用了 close(),就不应该再次调用 write(),因为这会隐式地调用 open() 来擦除当前文档并开始一个新的文档。

2.2 getElementByID()方法

getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。语法:

document.getElementById(id)

参考完整代码:

<html>
<head>
<script type="text/javascript">
function getValue()
{
var x=document.getElementById("myHeader")
alert(x.innerHTML)
}
</script>
</head>
<body>  

<h1 id="myHeader" onclick="getValue()">这是标题</h1>
<p>点击标题,会提示出它的值。</p>  

</body>
</html>  

2.3 getElemenByName()方法

getElementsByName() 方法可返回带有指定名称的对象的集合。

该方法与 getElementById() 方法相似,但是它查询元素的 name 属性,而不是 id 属性。

因为一个文档中的 name 属性可能不唯一(如 HTML 表单中的单选按钮通常具有相同的 name 属性),所有getElementsByName() 方法返回的是元素的数组,而不是一个元素。

getElementsByTagName() 方法可返回带有指定标签名的对象的集合。

getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。

如果把特殊字符串 "*" 传递给 getElementsByTagName() 方法,它将返回文档中所有元素的列表,元素排列的顺序就是它们在文档中的顺序。

传递给 getElementsByTagName() 方法的字符串可以不区分大小写。

2.4write()方法

write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。 可列出多个参数(exp1,exp2,exp3,...) ,它们将按顺序被追加到文档中。

语法:

document.write(exp1,exp2,exp3,....)

通常按照两种方式使用 write() 方法:

一是在使用该方法在文档中输出 HTML,另一种是在调用该方法的的窗口之外的窗口、框架中产生新文档。

第二种情况中,请务必使用 close() 方法来关闭文档。

示例:

参考代码:

<html>
<body>  

<script type="text/javascript">
document.write("Hello World! ","Hello You! ","<p style='color:blue;'>Hello World!</p>")
</script>  

</body>
</html>  
 

报表软件JS开发引用HTML DOM的location和document对象的更多相关文章

  1. JS开发引用HTML DOM的location和document对象

    上一次提到,在报表软件FineReport的JavaScript开发中,可以访问并处理的HTML DOM对象有windows.location.document三种.这次就继续介绍后两种,locati ...

  2. 报表软件JS开发引用HTML DOM的windows对象

    HTML DOM是W3C标准(是HTML文档对象模型的英文缩写,Document Object Model for HTML). HTML DOM定义了用于HTML的一些列标准的对象,以及访问和处理H ...

  3. Web报表工具JS开发之日期校验

    在报表开发过程中,我们常常需要对查询界面进行日期校验.例如有两个参数:开始日期和结束日期,我们要校验的是:开始日期与结束日期不能为空,结束日期必须在开始日期之后以及结束日期必须在开始日期后的某个时间段 ...

  4. JavaScript的DOM操作。Window.document对象

    间隔执行一段代码:window.setlnteval("需要执行的代码",间隔毫秒数) 例 :      window.setlnteval("alert("你 ...

  5. DOM操作(Window.document对象)

    间隔与延迟: 间隔一段代码: window.setInterval("代码",间隔执行秒数) 延迟一段时间后执行一段代码: window.setTimeout("执行代码 ...

  6. 移动端报表JS开发示例

    最近对移动端的报表开发颇有研究,细磨精算了好久,虽然到现在还是“囊中羞涩”,但决定还是先抛砖引玉,拿点小干货出来和大家分享. 研究的工具是比较有代表性的FineReport. 1.  移动端哪些地方支 ...

  7. 移动端报表JS开发示例--获取定位

    上次分享了移动端报表JS开发的系统概念,后来我又回去摸索了一些案例.之前接触到的FineReport的APP客户端可以用来打卡签到,就好奇研究了以下,这次就来聊一聊报表移动端开发如何实现定位功能. 1 ...

  8. 移动端报表JS开发演示样例

    近期对移动端的报表开发颇有研究,细磨精算了好久,尽管到如今还是"囊中羞涩",但决定还是先抛砖引玉,拿点小干货出来和大家分享. 研究的工具是比較有代表性的FineReport. 1. ...

  9. 【翻译】十大要避免的Ext JS开发方法

    原文地址:http://www.sencha.com/blog/top-10-ext-js-development-practices-to-avoid/ 作者:Sean Lanktree Sean ...

随机推荐

  1. Devexpress Gantt 应用

    甘特图属于甘特系列浏览次数(也称为时间或时间轴图表).此视图显示横条沿时间轴.每个条形代表一个单独的事件的开始和结束的值, 因此,这些图是用来跟踪各种活动的时间范围内(例如计划,利用各种资源,审查该项 ...

  2. 为什么volatile不能保证原子性而Atomic可以?

    在上篇<非阻塞同步算法与CAS(Compare and Swap)无锁算法>中讲到在Java中long赋值不是原子操作,因为先写32位,再写后32位,分两步操作,而AtomicLong赋值 ...

  3. 【夯实PHP基础】PHP的date函数

    本文地址 原文地址 提纲: 1. 引言 2. 代码示例 3. 参考资料 1. 引言 今天看到一段代码 $timeNew = date('n月j日', strtotime($oldTime)); 感觉有 ...

  4. PHP程序员的技术成长规划

    按照了解的很多PHP/LNMP程序员的发展轨迹,结合个人经验体会,抽象出很多程序员对未来的迷漫,特别对技术学习的盲目和慌乱,简单梳理了这个每个阶段PHP程序员的技术要求,来帮助很多PHP程序做对照设定 ...

  5. 常用C#关键字详解教程

    很多在学习网站后台的同学都对C#的关键字有些摸不到头脑,现在就和大家一起学习一下这些关键字的含义 类型 Void 用作方法的返回类型时,void 关键字指定方法不返回值. 在方法的参数列表中不允许使用 ...

  6. 实用CSS3的transform实现多种动画效果

    查看效果:http://keleyi.com/a/bjad/b6x9q8gs.htm 以下是代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4. ...

  7. javascript的列表切换

    演示地址:http://wjf444128852.github.io/demo/Carousel/index.html IE兼容性没处理,确切的说不太会,还望指点一二 思路: 1.js获取要给定点击事 ...

  8. Ionic + Cordova 跨平台移动开发环境配置

    1.下载安装JDK(根据各自系统选择32位或64位下载),安装完成之后需要做以下环境变量配置 在“系统变量”中,设置3象属性,JAVA_HOME,PATH,CLASSPATH(大小写无所谓),如果已经 ...

  9. Linux下安装使用Solr

    Linux下安装使用Solr 1.首先下载Solr.mmseg4j分词包.tomcat并解压,这用google.百度都可以搜索得到下载地址. 2.因为要使用到中文分词,所以要设置编码,进入tomcat ...

  10. Android自定义控件7--自定义开关--绘制界面内容

    本文实现全自定义控件--自定义开关 本文地址:http://www.cnblogs.com/wuyudong/p/5922316.html,转载请注明源地址. 自定义开关 (View),本文完成下面内 ...