正则取html标签属性，html5视频标签属性

HTML（Hypertext Markup Language）是一种用于创建网页的标准语言。在HTML中，标记用于描述文档及其内容，标记通常以标签的形式出现。标签由尖括号、标签名称和属性组成，属性是用于描述标签的额外信息。HTML5作为最新的HTML标准已经加入了许多新标签以及新属性，其中包括了HTML5视频标签，具体的标签属性如下：

1. controls 属性

controls 属性用于添加视频控制按钮，该属性可以添加到 video 标签中。controls 属性可以让用户在播放视频的过程中控制视频播放。当用户在播放视频时，可以点击或拖动播放头来调整视频进度，也可以将视频静音或取消静音，调整视频音量，或暂停或播放视频。

示例代码如下：

```html

Your browser does not support the video tag.

```

在上述代码中，我们添加了 video 标签和 controls 属性。如果您在浏览器中打开上述代码，您将看到一个播放器，可以在其中播放名为 "movie.mp4" 的视频。

2. autoplay 属性

autoplay 属性用于在网页加载时自动播放视频，该属性可以添加到 video 标签中。

示例代码如下：

```html

Your browser does not support the video tag.

```

在上述代码中，我们添加了 video 标签和 autoplay 属性。如果您在浏览器中打开上述代码，您将看到视频开始自动播放，而不需要用户手动单击播放按钮。

3. muted 属性

muted 属性用于在播放视频时设置静音，该属性可以添加到 video 标签中。muted 属性可以帮助您在用户无需声音的情况下自动播放视频。

示例代码如下：

```html

Your browser does not support the video tag.

```

在上述代码中，我们添加了 video 标签和 muted 属性。如果您在浏览器中打开上述代码，您将看到视频自动播放并且没有声音。

4. loop 属性

loop 属性用于在播放完视频后自动再次播放视频，该属性可以添加到 video 标签中。

示例代码如下：

```html

Your browser does not support the video tag.

```

在上述代码中，我们添加了 video 标签和 loop 属性。如果您在浏览器中打开上述代码，您将看到视频在播放完成后自动重复播放。

5. poster 属性

poster 属性用于在视频加载之前显示的图像，该属性可以添加到 video 标签中。

示例代码如下：

```html

Your browser does not support the video tag.

```

在上述代码中，我们添加了 video 标签和 poster 属性。如果您在浏览器中打开上述代码，您将看到视频在加载时显示名为 "poster.jpg" 的图像。

正则取HTML标签属性

正则表达式是一种文本处理工具，它可以用于从文本中提取信息。在HTML中，我们可以使用正则表达式来查找或提取具有某些属性的标签。我们可以使用 JavaScript 或其他编程语言中的正则表达式来搜索 HTML 标记的属性并提取它们。

下面是一段示例代码，展示了如何使用JavaScript来从HTML代码中提取具有某些属性的标签：

```js

const html = '

const regex = /<([a-zA-Z]*)[^>]*\sclass=["'](\S*)["'][^>]*>/;

const match = regex.exec(html);

console.log(match[1]); // "div"

console.log(match[2]); // "my-class"

```

在这个示例中，我们使用正则表达式 `/\<([\w]+)[^>]* class\=\"([^\"]+)\"\>/` 来匹配 HTML 中具有 class 属性的标记。正则表达式首先搜索尖括号中的任何字母字符，然后查找 class 属性，并提取在引号中的属性值。

总结

在HTML中，标记通常以标签的形式出现，需要用到属性来描述标签的额外信息，HTML5作为最新的HTML标准已经加入了许多新标签以及新属性，其中包括了视频标签的属性，包括：controls，autoplay，muted，loop，poster。而要提取HTML标签属性，则可以使用正则表达式来搜索 HTML 标记的属性并提取它们。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.ynyuzhu.com/