链接对象links

迷南。 2022-05-12 00:12 190阅读 0赞

**一 介绍**

在JavaScript中链接对象是文档对象的一个属性。在每个文档对象中都可以定义多个链接对象，而每一个链接对象都存储在links\[\]数组中。

链接对象以在页面中出现的顺序存储在links\[\]数组中。链接对象常用的属性及说明如下所示。

链接对象的常用属性及说明

<table style="border-collapse:collapse;border:1px solid #bbbbbb;width:645px;"> 
 <tbody> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">属 性</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">说 明</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">hash</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中锚的部分并包括“#”符号</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">host</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的主机名称和端口号</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">hostname</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的主机名称</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">href</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">完整的链接URL</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">pathname</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的路径名部分</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">port</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的端口号</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">protocol</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的协议部分并包括“：”</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">search</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接URL中的条件部分并包括“”符号</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">target</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:525px;" align="left">链接的目标窗口打开方式</td> 
  </tr> 
 </tbody> 
</table>

hash属性

该属性用来获取超链接URL中的锚标记的部分并包含“\#”符号。

语法：

\[anchor=\]links\[n\].hash

anchor：字符串变量，用来存储超链接URL中锚的标记。anchor是可选项。

host属性

该属性用来获取超链接URL中的主机名称和端口号。

语法：

\[nameNumber=\]links\[n\].host

nameNumber：字符串变量，用来存储超链接URL中的主机名称和端口号。nameNumber是可选项。

hostname属性

该属性用来获取超链接URL中的主机名称。

语法：

\[name=\]links\[n\].hostname

name：字符串变量，用来存储超链接URL中的主机名称和端口号。name是可选项。

href属性

该属性用来获取完整的超链接URL。

语法：

\[url=\]links\[n\].href

url：字符串变量，用来存储完整的超链接URL。url是可选项。

pathname属性

该属性用来获取超链接URL中的路径名部分。

语法：

\[urlName=\]links\[n\].pathname

urlName：字符串变量，用来存储路径名的部分。urlName是可选项。

port属性

该属性用来获取超链接URL中的端口号。

语法：

\[number=\]links\[n\].port

number：字符串变量，用来存储端口号。number是可选项。

protocol属性

该属性用来获取超链接URL中的协议部分并包括结尾处的“：”。

语法：

\[confer=\]links\[n\].protocol

confer：字符串变量，用来存储协议部分。confer是可选项。

search属性

该属性用来获取超链接URL中条件部分并包括“”。

语法：

\[term=\]links\[n\].search

term：字符串变量，用来存储条件部分。search是可选项。

target属性

该属性用来获取链接的目标窗口打开方式。

语法：

\[mode=\]links\[n\].target

mode：字符串变量，用来存储窗口打开方式，打开方式主要有4个属性，其属性值及说明如下表。

<table style="border-collapse:collapse;border:1px solid #bbbbbb;width:637px;"> 
 <tbody> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">属 性 值</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:517px;" align="left">说 明</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">_parent</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:517px;" align="left">表示在上一级窗口中打开。一般使用框架页时经常使用</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">_blank</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:517px;" align="left">表示在新窗口中打开</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">_self</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:517px;" align="left">表示在同一个窗口中打开</td> 
  </tr> 
  <tr> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:119px;" align="left">_top</td> 
   <td style="border-collapse:collapse;border:1px solid #bbbbbb;width:517px;" align="left">表示在浏览器的整个窗口中打开，忽略任何框架</td> 
  </tr> 
 </tbody> 
</table>

**二 应用 **

links对象属性使用

本示例在页面中显示了超链接的个数，并显示了超链接对象的部分属性值。

**三 代码**

<body>
    <a href="http://www.mrbccd.com/mr.html?s=10" target="_blank">编程网</a>
    <a href="#www.bcty365.com">体验网</a>
    <script>
    
    </script>
    </body>

**四 运行结果**

![907851e5-7b79-308f-a138-57e8109744bb.png][]

[907851e5-7b79-308f-a138-57e8109744bb.png]: /images/20220512/fbb7e79ae4494867bf85b6b7357c4705.png