zoukankan      html  css  js  c++  java
  • JS开发引用HTML DOM的location和document对象

    上一次提到,在报表软件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>
    <scripttype="text/javascript">
    function getValue()
    {
    var x=document.getElementById("myHeader")
    alert(x.innerHTML)
    }
    </script>
    </head>
    <body>
     
    <h1 id="myHeader"οnclick="getValue()">这是标题</h1>
    <p>点击标题,会提示出它的值。</p>
     
    </body>
    </html>

    2.3 getElementByName()方法

    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>
     
    <scripttype="text/javascript">
    document.write("Hello World!","Hello You! ","<p style='color:blue;'>HelloWorld!</p>")
    </script>
     
    </body>
    </html>


  • 相关阅读:
    socket
    netstat
    列表
    突然发现不会写代码了
    算法资源
    bit位操作
    排序算法
    连续子数组最大和
    books
    凸优化
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13326021.html
Copyright © 2011-2022 走看看