HTML 中 id与name 区别 一个name可以同时对应多个控件,比如checkbox和radio 而id必须是全文档中唯一的 id的用途 1) id是HTML元素的Identity,主要是在客户端脚本里用...当然HTML元素的name属性在页面中也可以起那么一点ID的作用,因为在DHTML对象树中,我们可以使用document.getElementsByName来获取一个包含页面中所有指定Name元素的对象数组...id具有唯一性,而class是一个类,适用于可多次重复使用的容器>> 关于ID和Name的一些注意事项 当然HTML元素的name属性在页面中也可以起那么一点id的作用,因为在DHTML对象树中,我们可以使用...如果页面中有n(n>1)个HTML元素的id都相同了怎么办?在DHTML对象中怎么引用他们呢?...这个时候我们还是可以继续使用document.getElementById获取对象,只不过我们只能获取id重复的那 些对象中在HTML Render时第一个出现的对象。
当一个规范到达了REC阶段时,这意味着它已经得到了W3C成员和主管的正式认可,并且W3C正式推荐各浏览器厂商进行开发,也推荐web开发者使用全新的特性。...在REC阶段,任何新特性都应该至少有两个独立的实现。对于我们这些开始使用新特性的web开发人员来说是一个伟大的时代。...变更履历地址:https://www.w3.org/TR/2017/REC-html52-20171214/ 新特性 原生的元素 在HTML 5.2的所有变更中,最让我兴奋的是的。 新添加的有效实践 除了新特性之外,HTML 5.2还启用了一些以前无效的HTML编写实践。...移除的特性 在HTML 5.2中,删除了一些元素,即: keygen:用于帮助生成表单的公钥。 menu和menuitem: 用于创建导航或上下文菜单。
对它们的理解和获取护照一样重要,如果您希望出国旅行的话。首先,什么是 ID?用简单的英语来说,ID 代表身份证件。每个人都有某种身份,可以被识别。...也就是说,如果您不希望某个项目改变或属于大众的类,最好的方法就是为该项目或元素应用 ID,这样您可以使用您为该元素或项目指定的 ID 名称,从 100 万个以上的其他项目中特别识别出它们。...在 HTML 文档中,ID 被写为例如; ID = sam;而在 CSS 中,它们用 # 符号表示,所以在 CSS 中 ID = sam 将会被写为或目标为 #sam。另一方面,类是灵活的。...看一下当您编写代码时,类和 ID 是如何在 HTML 中写入的示例。...id="calculator"> 看一下在 CSS 中如何定位 HTML 中的 ID 项目或元素。
用于id #用于class属性 html css中id和class的区别比较 1、语法区别: id对应css是用样式选择符“#”(井号)。 class对应css是用样式选择符“.”...2、使用次数区别: id属性,只能被一个元素调用(以“#”选择符命名CSS样式在一个页面只能使用调用一次)。在同一个页面,只可以被调用一次,在CSS里用“#”表示。...ID就像一个人的身份证,用于识别这个DIV的, Class就像人身上穿的衣服,用于定义这个DIV的样式。 一般一个网页不设二个或二个以上同ID的div,但Class可以多个DIV用同一个Class。...3、语义和使用不同: id作为元素的标签,用于区分不同结构和内容 而class作为一个样式,它可以应用到任何结构和内容 在布局思路上,一般坚持这样的原则: id是先确定页面的结构和内容,然后再为它定义样式...而class相反先定义一类样式,然后再页面中根据需要把类样式应用到不同的元素和内容上面。
HTML5新特性 (1). 新的语义标签 (2). 增强型表单(表单2.0) (3). 音频和视频 (4). Canvas绘图 (5). SVG绘图 (6). 地理定位 (7)....HTML5中表单的新特性 (1). 新的input type HTML5新特性-SVG绘图(Scalable Vector Graph:可缩放的矢量图) ?...HTML5新特性之七-拖放API (1)....HTML5新特性之八-Web Worker (1). 程序:Program,指可被CPU执行的代码,存储在外存中 (2).
本章的主要内容有: ---- [1] 用于媒体回放的 video 和audio 元素 [2] HTML5拖放 [3] canvas简单应用 [4] Web存储: localStorage 和 SessionStorage...视频/音频.png [2] HTML5拖放 把拖放元素的 draggable 属性设置为 true 拖放元素的属性 ondragstart 调用一个函数, 通过 event 的 dataTransfer.setData...HTML5 对象, 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法 */ // 画矩形 cxt.fillStyle = "#FFFF00"; /* 矩形的背景颜色...result.png [10] 服务器发送事件 EventSource HTML5 服务器发送事件 (server-sent event) 允许网页获得来自服务器的更新 id="resu...-- id 不能和前面例子的 id 相同 --> if(typeof EventSource !
概述 HTML5 的新增特性主要是针对于以前的不足,增加了一些新的标签、新的表单和新的表单属性等。...这些新特性都有兼容性问题,基本是 IE9+ 以上版本的浏览器才支持,如果不考虑兼容性问题,可以大量使用这些新特性。 语义化标签 (★★) 以前布局,我们基本用 div 来做。...新增input表单.png 类型很多,我们现阶段重点记忆三个: number tel search CSS3新特性 CSS3 的现状 新增的CSS3特性有兼容性问题,ie9+才支持 移动端支持优于...这样就可以不用借助于类或者id选择器 属性选择器也可以选择出来自定义的属性 注意:类选择器、属性选择器、伪类选择器,权重为 10。...这个集合有时称为 HTML5 和朋友,通常缩写为 HTML5 。 虽然 HTML5 的一些特性仍然不被某些浏览器支持,但是它是一种发展趋势。
返回值:返回包含 JSON 文本的字符串。 7.自定义对象属性: html5中可以通过data- 前缀就成为data 属性, 也可以应用CSS属性选择器进行样式设置。...数量不受限制,在控制和渲染数据的时候提供了非常强大的控制 dataset 获取属性值: \ id="day2-meal-expense" data-drink="coffee"...data-food="sushi" data- meal="lunch">¥20.12 id="button">点击我 var...coffee 8.html5 async 属性 defer : 延迟加载,会按顺序执行,在onload执行前被触发 语法: html5.git
HTML5新特性 HTML5是下一代HTML标准,是HTML最新的修订版本,2014年10月由万维网联盟W3C完成标准制定,HTML5将HTML从用于构造一个文档的一个简单标记,到一个完整的应用程序开发平台...,HTML5还包括新元素和用于增强存储、多媒体和硬件访问的JavaScript APIs。...示例 id="canvas" width="500" height="300" > var canvas...msup> = c2 拖放API 拖放是一种常见的特性...*/ Web Storage 使用HTML5可以在本地存储用户的浏览数据,localStorage和sessionStorage是HTML5提供的对于Web存储的解决方案。
1.HTML5是由W3C(万维网联盟,专注于XHTML 2.0)和WHATWG(专注于web表单和应用程序)共同合作的结果,2014年10月完成标准制定! 主要设计目的:为了在移动设备上支持多媒体。...2.HTML5新特性:(区分HTML) 绘画canvas; 用于媒介回放的video和audio元素; 本地离线缓存localStorage长期缓存数据,浏览器关闭后数据不丢失;sessionStorage...3.被HTML5抛弃的“孩子”(元素): 纯表现的元素:basefont,big,center,font,s,strike,tt,u等(可以用CSS替代); 对可用性产生负面性影响的元素:frameset...这样就可以让它们支持HTML5新标签;(以下代码在IETester下的IE 8和IE6测试通过) 1 的解决IE6-8不识别HTML5新元素方法,但是这些引入的新元素不能作为父元素包裹子元素;并且不能运用css样式╮(╯▽╰)╭,“万恶”的IE╮(╯▽╰)╭) 1 <!
1.新的文档类型 2.脚本和链接无需type 3.语义Header和Footer 4.Hgroup 5.标记元素 6.图形元素 7.重新定义 8.占位符 9.必要属性 10.Autofocus
语义化标签 原来的标签 id="wrapper"> id="header"> id="main"> id="sidebar..."> id="content"> id="footer"> h5语义化标签 的新功能 不同浏览器有不同的文件格式要求, 所以用2个source标签指定不同的格式 audio标签 id='id-audio-player' controls="controls...使用方式一样, 区别只在于过期时间 localStorage没有过期时间, 要用 clear remove 主动删除数据 sessionStorage的数据在用户关闭浏览器后将被删除 新增表单特性 <!...body { background: red; } } 本文作者: Ifan Tsai (菜菜) 本文链接: https://www.caiyifan.cn/p/28817.html
HTML5新特性 HTML5 是 HTML 的最新版本,它引入了许多新的标签、属性和功能,大大增强了 web 的功能和互动性。...HTML5 中的一些有趣的新特性: 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素,比如 article、footer、header...SVG 和 Canvas 的具体区别: 特性 SVG Canvas 图像类型 矢量 位图 缩放 无损 有损 图形类型 矩形、圆形、路径等 任意 操作 CSS、JavaScript JavaScript...JavaScript 进行操作和动画化的图形 Canvas 适用于场景: 需要创建复杂图形的场景,例如游戏、动画 需要使用 JavaScript 进行复杂操作的场景 HTML5表单 HTML5 引入了一些新的输入类型和属性...width 设置 元素的宽度。 list 指定与 或 元素相关联的 元素的 id。
不指定变化后的内容如何保存 contextmenu 定义menu元素的DOM id作为定义钙元素特性的上下文菜单 data-X 制定可以包含在标签中的用户定义的元数据,而不必担心这些元数据与当前的特性或者未来的特性冲突...使用这种类型的特性可以避免创建自定义特性或者过载class特性的常见方法 draggable 定义特性时,允许元素与其内容可以被拖放 hidden 在HTML5中,所有元素都可以有hidden特性,用于表示元素不相关...这是一个可选的特性,如果使用该特性,那么就必须将其放置在设置itemscope和itemtype两个特性的元素中。...该特性的特性值必须是URL形式的 itemprop 该特性用于为microdata项提供一对名称/值数据。...该特性是可选的,但是如果使用它,就必须将其放置在设置了itemscope特性的元素中 itemtype 该特性要与itemscope特性结合使用,用于定义一个microdata项的全局类型。
第一段里对于ID和Name的解答说的太笼统了,当然那个解释对于ID来说是完全对的,它就是Client端HTML元素的Identity。...显然这些用途都不是能简单的使用ID来代替掉的,所以HTML元素的ID和Name的却别并不是身份证号码和姓名这样的区别,它们更本就是不同作用的东西。 ...当然HTML元素的Name属性在页面中也可以起那么一点ID的作用,因为在DHTML对象树中,我们可以使用document.getElementsByName来获取一个包含页面中所有指定Name元素的对象数组...这里再顺便说一下,要是页面中有n(n>1)个HTML元素的ID都相同了怎么办?在DHTML对象中怎么引用他们呢?...这个时候我们还是可以继续使用document.getElementById获取对象,只不过我们只能获取ID重复的那些对象中在HTML Render时第一个出现的对象。
刚接触HTML的时候就知道描点,所以对描点这两个字特别熟悉,但一直没用过。...复制代码 // a.html id="one">第一个锚点 复制代码 // b.html 第二个锚点 如上所示,实现描点效果,需具备两个要素:...一般情况下,我们会在目标节点上添加id属性或者name属性,这个id或者name属性的值就是我们寻找锚点的依据,推荐使用id属性来标记锚点(因为id能够在各种标签上使用,name属性标记锚点时只能用在a...a标签一般用作定义超链接,用作超链接时它的href属性的值是另一个页面的URL。a标签用作锚点时,href的值是锚点的id值或者name值。...同一页面内的锚点跳转时,给href赋值# + 锚点id的值或者# + 锚点name的值,需要跳转其他页面的锚点位置时,需要在#前面加上跳转的路径,例如:href="b.html#two"
在本文中,我列出了十个我过去没用过的HTML5功能,但现在发现它们很有用,废话不多说,让我们开始吧。 detais 标签 标签向用户提供按需查看详细信息的效果。...如果需要按需向用户显示内容,简单的做法就是使用此标签。默认情况下,它是收起来的,打开后,它将展开并显示被隐藏的内容。...Map HTML 属性 与 属性一起使用来定义一个图像映射(一个可点击的链接区域)。可点击的区域可以是这些形状中的任何一个,矩形,圆形或多边形区域。...mark 标签 Did you know, you can "Highlight something interesting" just with an HTML tag... 作者:Ahmad shaded 译者:前端小智 来源:sitepoint 原文:https://dev.to/atapas/10-useful-html5-features-you-may-not-be-using
作者:Ahmad shaded 译者:前端小智 来源:sitepoint 在本文中,我列出了十个我过去没用过的HTML5功能,但现在发现它们很有用,废话不多说,让我们开始吧。 ?...默认情况下,它是收起来的,打开后,它将展开并显示被隐藏的内容。...Map HTML 属性 与 属性一起使用来定义一个图像映射(一个可点击的链接区域)。可点击的区域可以是这些形状中的任何一个,矩形,圆形或多边形区域。...mark 标签 Did you know, you can "Highlight something interesting" just with an HTML tag... id="colorMe">Color Me! ?
刚接触HTML的时候就知道描点,所以对描点这两个字特别熟悉,但一直没用过?。...id="one">第一个锚点 // b.html 第二个锚点 如上所示,实现描点效果,需具备两个要素: 需要有一个锚点,这个锚点就是我们要跳转到的位置...一般情况下,我们会在目标节点上添加id属性或者name属性,这个id或者name属性的值就是我们寻找锚点的依据,推荐使用id属性来标记锚点(因为id能够在各种标签上使用,name属性标记锚点时只能用在a...a标签一般用作定义超链接,用作超链接时它的href属性的值是另一个页面的URL。a标签用作锚点时,href的值是锚点的id值或者name值。...同一页面内的锚点跳转时,给href赋值# + 锚点id的值或者# + 锚点name的值,需要跳转其他页面的锚点位置时,需要在#前面加上跳转的路径,例如:href="b.html#two"
不到一个月之前,W3C官方发布 HTML5.2,并成为官方推荐使用标准。这意味着作为web开发者,我们可以愉快地使用5.2中的新特性了。...W3C在HTML5.2中添加了一些新特性,也有一些曾经的特性被移出了。这篇文章里笔者会为大家介绍一下对开发者影响较大的一些更新。...新特性 原生提供元素 众所周知,dialog是web开发中非常常用的一个组件,很多人的前端组件开发之路都是从开发一个dialog开始的。... id="open">Open Dialog id="close">Close Dialog 移除的特性 在HTML5.2中一些元素被移除了,比如: keygen:帮助forms生成公钥 menu和menuitem:用来生成导航或者菜单 最新的列为无效的实践 在HTML5.2
领取专属 10元无门槛券
手把手带您无忧上云