关于html5中自定义属性的介绍

关于html5中自定义属性的介绍

定义

H5为我们提供了以 “data-” 为前缀定义需要的属性即可设置自定义属性

登录后复制

(推荐教程:H5教程)

获取

使用H5自定义属性对象dataset来获取

立即学习“前端免费学习笔记(深入)”;

let box1 = document.getElementById('box1');let box2 = document.getElementById('box2'); box1.dataset.name // Muskbox2.dataset.fullName // Elon Musk (驼峰) box1.getAttribute('data-name') // Muskbox2.getAttribute('data-full-name') // Elon Musk

登录后复制

设置

let box1 = document.getElementById('box1');let box2 = document.getElementById('box2'); box1.dataset.name = '马斯克'box2.setAttribute('data-full-name', '埃隆 马斯克')

登录后复制

相关视频教程推荐:html5视频教程

以上就是关于html5中自定义属性的介绍的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2907969.html

(0)
上一篇 2025年3月11日 03:03:45
下一篇 2025年2月19日 08:53:30

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • 移动端h5页面尺寸大小

    移动端h5的尺寸一般设计为640x1136px。 既满足了显示需求,又能降低用户加载图片需要的带宽。 可以用各种分辨率的移动智能手机查看我们设计的H5页面时,当然,也会出现如下的情况,内容显示不全,甚至一些重要内容和按钮都会被遮挡。 第一:…

    2025年3月11日
    000
  • HTML5 canvas如何实现代码流瀑布?(附代码)

    本篇文章给大家分享html5 canvas代码流瀑布的具体代码。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 在js部分写canvas代码,有详细注释 html部分: 一个canvas元素: 立即学习“前端免费学习笔记(…

    2025年3月11日
    200
  • HTML5实现对话气泡点击动画

    本篇文章给大家介绍一下使用html5实现对话气泡点击动画的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。 需求 还是要先把需求拿出来。 要求: 对话气泡要有动画,动画总共4秒在没有点击的时候,气泡每隔8秒出现一次在点…

    2025年3月11日
    200
  • html5不常用标签可以怎么使用?

    作为一个前端开发,在浏览别人家的页面时总是会习惯性的查看他们页面的源码,发现大多数网站的页面,包括我自己写的页面中用到的最多的布局元素无外乎就是div、p、span、ul、dl、ol、li、dt、dd、strong、b,不管是什么样的效果都…

    2025年3月11日 编程技术
    200
  • 通过html5中的canvas来绘制一个圆环形进度条

    首先我们来看一下实现效果: (学习视频分享:html视频教程) 我这里使用HTML5的Canvas来要制作这样一个圆环形的进度, 立即学习“前端免费学习笔记(深入)”; 首先是HTML页面,HTML5的文档标识是: nbsp;html&gt…

    2025年3月11日 编程技术
    200
  • HTML5本地存储之WebStorage介绍

    WebStorage是HTML5中本地存储的解决方案之一,在HTML5的WebStorage概念引入之前除去IE User Data、Flash Cookie、Google Gears等看名字就不靠谱的解决方案,浏览器兼容的本地存储方案只有…

    2025年3月11日 编程技术
    200
  • html5怎么嵌入视频

    首先我们要知道HTML5是支持直接在浏览器中播放音频和视频文件的,不需要使用 adobe flash 插件。 插件缺点:插件是令浏览器崩溃的主要原因之一,特别是 flash,存在着很多问题。 (视频学习推荐:html5视频教程) 在网页中嵌…

    2025年3月11日 编程技术
    200
  • HTML5设置视频背景的方法介绍

    我们常常有着将视频作为网页背景的需要,但是在设置时也经常差强人意,今天设置了一下,可以基本达到要求了,可能有些小细节做的不是太好,希望指出来,一起进步 第一步:准备工作 工欲善其事必先利其器,我们首先需要准备一个视频,我准备了一个这样的视频…

    2025年3月11日
    200
  • html5实现图片的3D旋转效果

    我们先来看一下实现效果: (学习视频分享:html视频教程) H5旋转3D相册,鼠标放置暂停,图片灰度级为0,有放大效果。 立即学习“前端免费学习笔记(深入)”; 该实例运用H5和CSS3动画效果,未用javascript。提高了本人对CS…

    2025年3月11日
    200
  • html5实现一个简单的在线画板

    我们先来看看实现效果: (推荐教程:h5) 实现代码如下: 立即学习“前端免费学习笔记(深入)”; nbsp;html>                                             var c = docu…

    2025年3月11日
    200

发表回复

登录后才能评论