HTML5 什么是 itemscope 属性?用外行人的话来说它有什么作用?

2024-04-28

我只是想知道 HTML5 itemscope 属性的基本用途是什么?


The [itemscope]attribute 是一个布尔属性,用于定义元素中包含的元数据的范围。

它定义在HTML5 微数据 http://www.w3.org/TR/microdata/#attr-itemscope API:

每个 HTML 元素可能有一个itemscope属性指定。这itemscope属性是一个布尔属性。

一个元素与itemscope指定的属性创建一个新的item,一组名称-值对。

换句话说,它是一种将元数据与特定 DOM 节点关联的方法。

这是由Schema.org http://schema.org/用于关联搜索引擎和社交网络数据的 API。Google+ 使用架构 http://schema.org/WebPage作为为用户共享的页面提供标题、缩略图和描述的方式。


还应该指出的是[itemscope] and [itemprop]与 Facebook 兼容开放图协议 https://developers.facebook.com/docs/opengraphprotocol/为网页提供元数据时。可以在一组数据中列出搜索引擎、Facbook 和 Google+ 的相同元数据<meta>元素,而不必多次列出相同的信息:

<html itemscope itemtype="http://schema.org/WebPage" xmlns:fb="https://www.facebook.com/2008/fbml">
  <head>
    <title>An Example Title</title>
    <meta content="An Example Title" itemprop="name" property="og:title" />
    <meta content="Lorem ipsum dolor sit amet" itemprop="description" name="description" property="og:description" />
    <meta content="http://www.example.com/image.jpg" itemprop="image" property="og:image" />
    <meta content="http://www.example.com/permalink" itemprop="url" property="og:url" />
    <link rel="canonical" href="http://www.example.com/permalink" />
  </head>
  <body>
    ...content...
  </body>
</html>

请注意,在示例中,[itemscope]被添加到<html>元素。这意味着任何[itemprop]中的属性<head> and <body>是的一部分WebPage item.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

HTML5 什么是 itemscope 属性?用外行人的话来说它有什么作用? 的相关文章

  • 表格内的垂直滚动条不显示:块

    有没有办法在里面有一个垂直滚动条 tbody 一张桌子并有display table放在桌子上但不使用display block桌子内的任何地方 对于滚动条部分 将其添加到要滚动的标签中 style overflow y scroll tb
  • Javascript 可折叠面板默认打开

    我正在关注这个代码示例在这里找到 https www w3schools com howto howto js collapsible asp使用 css html javascript 创建可折叠面板 function toggleCol
  • Bootstrap 全角,有 2 种不同的背景(和 2 列)

    这有点难以解释 这就是为什么我在谷歌上也找不到答案 我正在使用 Bootstrap 3 并且需要全宽背景图像 在那 2 个透明颜色背景之上 我制作了一个示例图片以使其更清楚 1 2 组合透明彩色背景 3 4 组合透明彩色背景 1 2 3 4
  • 在响应式设计中将顶部元素移动到底部的最佳方法是什么

    我有以下 HTML 格式 将给定元素放置在桌面上的顶部和移动设备上的底部 宽度 p I am on the top of desktop page and bottom of mobile page p 以响应式方式重新排序未知高度的元素最
  • 修复 PHP 中格式错误的 HTML?

    我正在根据用户提供的片段构建一个大型 HTML 文档 这些用户有以各种方式格式错误的烦人习惯 浏览器足够强大且宽容 但我希望能够验证并 理想情况下 修复任何格式错误的 HTML 如果可能的话 例如 td b Title b td 可以合理地
  • jQuery 提交未触发

    我觉得问这个很愚蠢 但为什么我的 submit 没有发出警报 HTML div class buttonbar style margin left 10 div
  • 单击 div 中的图像时如何翻转该 Div?

    好吧 我对编写 Javascript 知之甚少 我可以对其进行一些编辑 并且涉足了 CSS3 动画 我将向您展示我正在努力实现的目标 然后在下面进行解释 网站布局将是这样的 https i stack imgur com RMb4R jpg
  • 将文本数据作为表单中的文件发布

    是否可以从 html 表单中发布一些作为文件输入类型的字符串的 XML 数据 情况是我有一个像这样的表格 form action target php method post enctype multipart form data gt
  • 防止文本环绕浮动图像

    我目前有一个向左浮动的图像 以及位于其右侧的一段文本 该文本块当前不是浮动的 它只是位于 HTML 中的图像之后 因此 当它变得更长时 它最终会踢到图像下方的左侧以继续 如何才能使文本块始终保持在图像的右侧 以便图像和文本的行为就像两个并排
  • 在 Flask 中使用 html 运行 python 脚本

    我是 Flask 新手 我试图在单击 html 页面中的按钮时从后台运行 python 脚本 这是我的代码 from flask import from functools import wraps import sqlite3 app F
  • 通过 AJAX jquery 更改表格背景颜色?

    设想 当我的网页加载时 自动搜索单元格已由用户输入并且具有价值 如果已输入 表格背景颜色将为红色 否则为绿色 假设该表尚未输入 桌子背景绿色是这样的 和表的源代码 table width 1023 height 200 border 1 t
  • 无限循环中的 JavaScript 警报消息

    无限循环中的警报框 在这里我尝试在两个连续字段上放置弹出警报消息 这样它们就不能留空 我知道为什么会发生这种情况 因为当第一个函数的 onblur 事件启动时 它会将焦点放在第二个字段上 当它跳回第一个时 第二个文本字段的 onblur 启
  • 音频标签的 Html5 惰性“onplay”事件处理程序?

    使用新的 Html5 音频标签 onplay 事件似乎仅在第一次播放音频时触发 在此示例中 当单击 播放 时 音频将开始并显示一个显示 正在播放 的警报弹出窗口 当音频结束并再次单击 播放 时 音频会再次开始 但不会触发警报 我在这里错过了
  • 选择多选选项最多 2 个

    我正在对不同主题使用多重选择 我想将选择限制为最多 2 个 并且如果用户取消选择 则以相同的方式禁用其他选项 同样 该选项必须可供用户使用
  • 元素存在之前的html5音频绑定时间更新

    我试图从音频标签绑定 timeupdate 事件 该标签尚不存在 我习惯这样做 body on click selector function e 我用音频标签尝试了这个 body on timeupdate audioPlayerJS a
  • 如何使用 javascript 将我的域名字母大写?

    假设我的域名是www hello com 如何使用 jQuery JavaScript 使浏览器的 URL 栏看起来像 www HELLO com 您无法更改浏览器地址栏中显示的内容 这是一项基本的安全功能 您可以使您的域名全部大写 并将页
  • 使用mysql数据按高低价格排序

    这是我所拥有的以及我想做的 我的 MySql 数据库中有 12 个项目 4 个产品为 4 99 4 个产品为 3 99 4 个产品为 2 99 我意识到我可以像这样查询数据库 它会给我一个该价格的产品列表
  • 无需画布/显示器即可拍摄隐形 WebRTC/视频照片

    我读了拍摄静态照片 https developer mozilla org en US docs Web API WebRTC API Taking still photos来自 MDN 的描述如何从网络摄像头捕获照片 使用视频元素和med
  • 单击 html 中的按钮后如何从 javascript 函数写入文件

    我正在尝试编写真正基本的代码 在 html 文件上按下按钮后 通过 JavaScript 函数在本地写入 txt 文件 这不可能吗 我可以仅使用 javascript 文件写入文件 但在尝试同时使用两者时则不能
  • 调用一个从 AngularJS 表达式本地计算值的函数是不是很糟糕?

    我读了关于使用范围的一些 AngularJS 陷阱的文章 http thenittygritty co angularjs pitfalls using scopes 并且它指出您不应在表达式中使用函数 并且我知道每次框架认为需要时都可能会

随机推荐