数据结构
网络
关系数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法学HTML5 中的微数据 API
在 HTML5 中，微数据用于将元数据嵌套到已存在的网页内容中。通过这种方法，可以轻松地将机器可读数据插入到 HTML 文档中，并具有清晰的解析范式。使用微数据，我们可以创建自己独特的元素，并开始将独特的属性添加到我们的网页中。
微数据由一系列名称-值对组成。项目是一组名称-值对，每个名称-值属性称为属性。使用常规元素来表示项目和属性。
HTML5 微数据全局属性
微数据引入了以下五个全局属性，任何元素都可以使用它们来为计算机提供关于我们数据的上下文。
让我们逐一了解，以便更好地理解 HTML5 中的微数据。
属性 |
描述 |
|---|---|
| itemscope | 定义微数据项目的范围。 |
| itemprop | 定义微数据的名称/值对。 |
| itemtype | 用于定义用于编码微数据的词汇表的 URL。 |
| itemid | 为微数据项目设置唯一标识符。 |
| itemref | 包含 itemscope 属性之外的 itemprop 属性。 |
让我们看一下 HTML5 中微数据 API 的以下示例，以便更好地理解。
使用“item type”属性
与特定 item type 关联的属性是 item type 属性。它充当全局变量，任何流程活动都可以引用或修改它。通常，item type 属性提供有关对象的信息，这些信息对于工作流程过程正确管理项目是必需的。
示例
在下面的示例中，我们使用 itemscope 属性（这是一个布尔属性，它定义了指定元数据的范围）以及 item type 属性。
<!DOCTYPE html>
<html>
<body>
<span itemprop="name">Welcome To Tutorialspoint</span>
<img src="https://tutorialspoint.com/images/logo.png" alt="Logo">
<div itemprop="aggregateRating" itemscope itemtype="https://tutorialspoint.com/images/logo.png">
<meter itemprop="Courses" min=0 value=3.5 max=5>Rated 3.5/5</meter>
(People Intrested <span itemprop="reviewCount"></span> In JAVA Learning)
</div>
</body>
</html>
输出
当脚本执行时，它将生成一个输出，显示文本以及使用 <img> src 上传的图像和网页上的仪表。
使用“itemref”属性
ref 是一个特殊的属性，它使我们能够在 DOM 元素或子组件实例挂载后直接引用它。
示例
考虑以下示例，我们在这里使用 itemref 属性，它打印 itemref 属性下提到的所有 id 值。
<!DOCTYPE html>
<html>
<body>
<div itemscope itemref="CARS BIKES">MOTORLIFE</div>
<article>
<div id=CARS1>
<span itemprop=CARS>BMW</span><br>
<span itemprop=CARS>BENZ</span>
</div>
<div id=BIKE1>
<span itemprop=BIKE>DUCATI</span><br>
<span itemprop=BIKE>TRIUMPH</span>
</div>
</article>
</body>
</html>
输出
运行上述脚本后，它将生成一个输出，其中包含脚本中使用的文本以及使用 itemref 属性在网页上生成的文本。
使用“itemprop”属性
要向项目添加属性，请使用 itemprop 全局属性。可以为任何 HTML 元素提供 itemprop 属性，它以名称-值对作为参数。
示例
请看下面的例子。我们在句子中的 span 标签中使用 itemprop 属性。
<!DOCTYPE html>
<html>
<body>
<article itemscope>
<h2 itemprop="NAME">MSD</h2>
<ul>
<li>Nationality: <span itemprop="nationality">INDIAN</span></li>
<li>Age: <span itemprop="age">41</span></li>
<li>Hair colour: <span itemprop="colour">LONG BROWN COLOURED HAIR</span></li>
</ul>
</article>
</body>
</html>
输出
当用户尝试执行脚本时，它将显示一个输出，其中包含使用“itemprop”属性在网页上生成的数据。
浏览量：336
