HTML DOM del cite属性用法及代码示例

与 HTML <del> 元素关联的 HTML DOM del cite 属性用于告诉用户为什么网站上的某些文本被删除。它通过指定说明为什么给定文本被删除的 url 来实现。

del cite 属性增加了我们网站的可访问性，因为它没有视觉提示，但可以帮助屏幕阅读器。 del cite 属性设置或返回 HTML <del> 元素的 cite 属性值。

用法

以下是语法 -

设置引用属性 -

delObject.cite = URL

此处，URL 指定说明文本被删除原因的文档的 URL。 URL 可以是相对的或绝对的。

示例

让我们看一个 HTML DOM del cite 属性的例子 -

<!DOCTYPE html>
<html>
<head>
<title>Del cite</title>
<style>
#Sample{color:blue};
</style>
</head>
<body>
<h2>del cite property example</h2>
<p><del id="Del1" cite="sampleDeleted.html">Some text has been deleted</del></p>
<p>Click the below button to change the cite attribute value of the above deleted text</p>
<button onclick="citeChange()">Change Cite</button>
<p id="Sample"></p>
<script>
   function citeChange() {
      document.getElementById("Del1").cite = "https://example.com/deletedText.html";
      document.getElementById("Sample").innerHTML = "The del cite attribute value was changed to 'https://example.com/deletedText.html'.";
   }
</script>
</body>
</html>

输出

这将产生以下输出 -

单击更改引用按钮 -

在上面的例子中 -

我们首先在 <p> 元素中创建了 <del> 元素，该元素的 id 为 “Del1”，并且 del 元素的 cite 属性值设置为 “sampleDeleted.html”。

<p><del id="Del1" cite="sampleDeleted.html">Some text has been deleted</del></p>

然后我们创建了一个 “Change Cite” 按钮，当用户点击时，它将执行 citeChange() 方法 -

<button onclick="citeChange()">Change Cite</button>

citeChange() 方法使用 getElementById() 方法获取 <del> 元素并将其 cite 属性值更改为“https://example.com/deletedText.html”。然后我们使用段落元素的innerHTML 属性在id 为“Sample” 的段落中显示此更改。 “Sample” 段落内的文本显示为蓝色，因为我们应用了与其 id 对应的样式 -

function citeChange() {
   document.getElementById("Del1").cite = "https://example.com/deletedText.html";
   document.getElementById("Sample").innerHTML = "The del cite attribute value was changed to 'https://example.com/deletedText.html'.";
}

相关用法

注：本文由纯净天空筛选整理自AmitDiwan大神的英文原创作品 HTML DOM del cite Property。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。