HTML DOM Area 对象


HTML DOM Area 对象文档

概述

HTML DOM Area 对象用于表示 HTML 页面中的图像区域。每个区域都定义了与图像关联的超链接,当用户单击区域时,将会触发超链接的跳转。

属性

1. coords

Area 对象的 coords 属性是针对形状区域的一个数组,它包含相对于图像左上角的坐标。坐标的数量和顺序取决于所定义的 area 形状。

2. href

Area 对象的 href 属性指定与区域关联的 URL。单击区域将导航到指定的URL。

3. target

Area 对象的 target 属性指定超链接目标的浏览器窗口或帧的名称。

4. shape

Area 对象的 shape 属性规定此区域的形状。

5. noHref

Area 对象的 noHref 属性是布尔属性,它指定该区域是否有关联的超链接。如果该属性设置为 true,则区域不是超链接。

6. alt

Area 对象的 alt 属性是一个字符串,它为当图像不能显示或者用户停留在区域时显示的替代文本。

方法

1. blur()

Area 对象的 blur() 方法将使区域的焦点丢失。

2. focus()

Area 对象的 focus() 方法将使区域的焦点获取。

事件

1. blur

当区域失去焦点时触发 blur 事件。

2. focus

当区域获取焦点时触发 focus 事件。

3. click

当用户单击区域时触发 click 事件。

示例

<html>
  <head>
    <title>Area Object Example</title>
  </head>
  <body>
    <img src="example.png" usemap="#map" />
    <map name="map">
      <area shape="rect" coords="0,0,50,50" href="http://www.example.com" target="_blank" />
      <area shape="circle" coords="75,75,25" noHref="true" alt="I'm a circle!" />
    </map>
  </body>
</html>

在这个例子中,我们定义了一个矩形区域和一个圆形区域。当用户单击矩形区域时,它将跳转到链接的页面,而当用户单击圆形区域时,它将不会跳转页面并显示替代文本。

结论

HTML DOM Area 对象是用于表示 HTML 页面中的图像区域的对象。它包含了属性和方法以及相应的事件,这些可以用于控制区域的访问和行为。对于 Web 开发人员来说,理解和使用 Area 对象的知识是网站功能强大和用户友好体验的关键。