属性 值 描述
accesskey character 规定访问元素的键盘快捷键
class classname 规定元素的类名（用于规定样式表中的类）。
contenteditable
  • true
  • false
 规定是否允许用户编辑内容。
contextmenu menu_id 规定元素的上下文菜单。
data-yourvalue value

创作者定义的属性。

HTML 文档的创作者可以定义他们自己的属性。

必须以 "data-" 开头。
dir
  • ltr
  • rtl
 规定元素中内容的文本方向。
draggable
  • true
  • false
  • auto
 规定是否允许用户拖动元素。
hidden hidden 规定该元素是无关的。被隐藏的元素不会显示。
id id 规定元素的唯一 ID。
item
  • empty
  • url
 用于组合元素。
itemprop
  • url
  • group value
 用于组合项目。
lang language_code 规定元素中内容的语言代码。语言代码参考手册。
spellcheck
  • true
  • false
 规定是否必须对元素进行拼写或语法检查。
style style_definition 规定元素的行内样式。
subject id 规定元素对应的项目。
tabindex number 规定元素的 tab 键控制次序。
title text 规定有关元素的额外信息。
标签 描述 4 5
<!--...--> 定义注释。 4 5
<!DOCTYPE>  定义文档类型。 4 5
<a> 定义超链接。 4 5
<abbr> 定义缩写。 4 5
<acronym> HTML 5 中不支持。定义首字母缩写。 4  
<address> 定义地址元素。 4 5
<applet> HTML 5 中不支持。定义 applet。 4  
<area> 定义图像映射中的区域。 4 5
<article> 定义 article。   5
<aside> 定义页面内容之外的内容。   5
<audio> 定义声音内容。   5
<b> 定义粗体文本。 4 5
<base> 定义页面中所有链接的基准 URL。 4 5
<basefont> HTML 5 中不支持。请使用 CSS 代替。 4  
<bdo> 定义文本显示的方向。 4 5
<big> HTML 5 中不支持。定义大号文本。 4  
<blockquote> 定义长的引用。 4 5
<body> 定义 body 元素。 4 5
<br> 插入换行符。 4 5
<button> 定义按钮。 4 5
<canvas> 定义图形。   5
<caption> 定义表格标题。 4 5
<center> HTML 5 中不支持。定义居中的文本。 4  
<cite> 定义引用。 4 5
<code> 定义计算机代码文本。 4 5
<col> 定义表格列的属性。 4 5
<colgroup> 定义表格列的分组。 4 5
<command> 定义命令按钮。   5
<datalist> 定义下拉列表。   5
<dd> 定义定义的描述。 4 5
<del> 定义删除文本。 4 5
<details> 定义元素的细节。   5
<dfn> 定义定义项目。 4 5
<dir> HTML 5 中不支持。定义目录列表。 4  
<div> 定义文档中的一个部分。 4 5
<dl> 定义定义列表。 4 5
<dt> 定义定义的项目。 4 5
<em> 定义强调文本。 4 5
<embed> 定义外部交互内容或插件。   5
<fieldset> 定义 fieldset。 4 5
<figcaption> 定义 figure 元素的标题。   5
<figure> 定义媒介内容的分组，以及它们的标题。   5
<font> HTML 5 中不支持。 4  
<footer> 定义 section 或 page 的页脚。   5
<form> 定义表单。 4 5
<frame> HTML 5 中不支持。定义子窗口（框架）。 4  
<frameset> HTML 5 中不支持。定义框架的集。 4  
<h1> to <h6> 定义标题 1 到标题 6。 4 5
<head> 定义关于文档的信息。 4 5
<header> 定义 section 或 page 的页眉。   5
<hgroup> 定义有关文档中的 section 的信息。   5
<hr> 定义水平线。 4 5
<html> 定义 html 文档。 4 5
<i> 定义斜体文本。 4 5
<iframe> 定义行内的子窗口（框架）。 4 5
<img> 定义图像。 4 5
<input> 定义输入域。 4 5
<ins> 定义插入文本。 4 5
<keygen> 定义生成密钥。   5
<isindex> HTML 5 中不支持。定义单行的输入域。 4  
<kbd> 定义键盘文本。 4 5
<label> 定义表单控件的标注。 4 5
<legend> 定义 fieldset 中的标题。 4 5
<li> 定义列表的项目。 4 5
<link> 定义资源引用。 4 5
<map> 定义图像映射。 4 5
<mark> 定义有记号的文本。   5
<menu> 定义菜单列表。 4 5
<meta> 定义元信息。 4 5
<meter> 定义预定义范围内的度量。   5
<nav> 定义导航链接。   5
<noframes> HTML 5 中不支持。定义 noframe 部分。 4  
<noscript> 定义 noscript 部分。 4 5
<object> 定义嵌入对象。 4 5
<ol> 定义有序列表。 4 5
<optgroup> 定义选项组。 4 5
<option> 定义下拉列表中的选项。 4 5
<output> 定义输出的一些类型。   5
<p> 定义段落。 4 5
<param> 为对象定义参数。 4 5
<pre> 定义预格式化文本。 4 5
<progress> 定义任何类型的任务的进度。   5
<q> 定义短的引用。 4 5
<rp> 定义若浏览器不支持 ruby 元素显示的内容。   5
<rt> 定义 ruby 注释的解释。   5
<ruby> 定义 ruby 注释。   5
<s> HTML 5 中不支持。定义加删除线的文本。 4  
<samp> 定义样本计算机代码。 4 5
<script> 定义脚本。 4 5
<section> 定义 section。   5
<select> 定义可选列表。 4 5
<small> 定义小号文本。 4 5
<source> 定义媒介源。   5
<span> 定义文档中的 section。 4 5
<strike> HTML 5 中不支持。定义加删除线的文本。 4  
<strong> 定义强调文本。 4 5
<style> 定义样式定义。 4 5
<sub> 定义下标文本。 4 5
<summary> 定义 details 元素的标题。   5
<sup> 定义上标文本。 4 5
<table> 定义表格。 4 5
<tbody> 定义表格的主体。 4 5
<td> 定义表格单元。 4 5
<textarea> 定义 textarea。 4 5
<tfoot> 定义表格的脚注。 4 5
<th> 定义表头。 4 5
<thead> 定义表头。 4 5
<time> 定义日期/时间。   5
<title> 定义文档的标题。 4 5
<tr> 定义表格行。 4 5
<tt> HTML 5 中不支持。定义打字机文本。 4  
<u> HTML 5 中不支持。定义下划线文本。 4  
<ul> 定义无序列表。 4 5
<var> 定义变量。 4 5
<video> 定义视频。   5
<xmp> HTML 5 中不支持。定义预格式文本。 4  

标准事件属性
HTML 4 增加了通过事件触发浏览器中行为的能力，比如当用户点击某个元素时启动一段 JavaScript。

如果需要学习更多有关使用这些事件进行编程的内容，请学习我们的 JavaScript 教程 和 DHTML 教程。

下面的表格列出了可插入 HTML 5 元素中以定义事件行为的标准事件属性。

Window 事件属性 - Window Event Attributes 
表单事件 - Form Events 
键盘事件 - Keybord Events 
鼠标事件 - Mouse Events 
媒介事件 - Media Events

输入校验

方法一：

<form action="add">
<input name="name" type="text" required/><br/>
<input name="isbn" type="text"
required pattern="\d"/><br/>
<input name="price" type="number" 
min="20" max="150" step="5"/><br/>
<input type="submit" value="提交"/>
</form>

方法二：

<form
action="add">
  <input
id="name"
name="name"
type="text"
required/><br/>
  <input
id="isbn"
name="isbn"
type="text"
  required
pattern="\d{3}-\d-\d{3}-\d{5}"/><br/>
  <input
id="price"
name="price"
type="number"
  min="20"
max="150"
step="5"/><br/>
  <input
type="submit"
value="提交"
onclick="check();"/>
  </form>
  <script
type="text/javascript">
  var check = function()
  {
  if(!document.getElementById("name").checkValidity())
  {
  document.getElementById("name").setCustomValidity("图书名是必填的！");
  }
  if(!document.getElementById("isbn").checkValidity())
  {
  document.getElementById("isbn").setCustomValidity("图书ISBN必须填写，"
  + "\n而且必须符合xxx-x-xxx-xxxxx的格式（其中x代表数字）。");
  }
  if(!document.getElementById("price").checkValidity())
  {
  document.getElementById("price").setCustomValidity("图书价格必须填写，"
  + "\n而且必须在20~150之间，且是5的倍数。");
  }
  };
  </script>

方法三：自定义输出信息

<form
action="add">
  生日：<input
id="birth"
name="birth"
type="date"/><br/>
  邮件地址：<input
id="email"
name="email"
type="email"/><br/>
  <input
type="submit"
value="提交"
onclick="return check();"/>
  </form>
  <script
type="text/javascript">
  var check = function()
  {
  return commonCheck("birth" , "生日" , "字段必须是有效的日期！")
  && commonCheck("email" , "邮件地址" , "字段必须符合电子邮件的格式！");
  }
  var commonCheck = function(field , fieldName , tip)
  {
  var targetEle = document.getElementById(field);
  // 如果该字段的值为空
  if (targetEle.value.trim() == "")
  {
  alert(fieldName + "字段必须填写！");
  return false;
  }
  // 调用checkValidity()方法执行输入校验
  else if(!targetEle.checkValidity())
  {
  alert(fieldName + tip);
  return false;
  }
  return true;
  }
  </script>

Html5笔记之第四天的更多相关文章

  1. Deep Learning论文笔记之（四）CNN卷积神经网络推导和实现（转）

    Deep Learning论文笔记之(四)CNN卷积神经网络推导和实现 zouxy09@qq.com http://blog.csdn.net/zouxy09          自己平时看了一些论文, ...

  2. 【Unity Shaders】学习笔记——SurfaceShader（四）用纹理改善漫反射

    [Unity Shaders]学习笔记——SurfaceShader(四)用纹理改善漫反射 转载请注明出处:http://www.cnblogs.com/-867259206/p/5603368.ht ...

  3. python学习笔记--Django入门四 管理站点--二

    接上一节  python学习笔记--Django入门四 管理站点 设置字段可选 编辑Book模块在email字段上加上blank=True,指定email字段为可选,代码如下: class Autho ...

  4. VSTO学习笔记（十四）Excel数据透视表与PowerPivot

    原文:VSTO学习笔记(十四)Excel数据透视表与PowerPivot 近期公司内部在做一种通用查询报表,方便人力资源分析.统计数据.由于之前公司系统中有一个类似的查询使用Excel数据透视表完成的 ...

  5. HTML5笔记3——Web Storage和本地数据库

    上一篇:HTML5笔记2——HTML5音/视频标签详解 Web Storage概述 在HTML5中,除了Canvas元素之外,另一个新增的非常重要的功能是可以再客户端本地保存数据的Web Storag ...

  6. Python学习笔记（十四）

    Python学习笔记(十四): Json and Pickle模块 shelve模块 1. Json and Pickle模块 之前我们学习过用eval内置方法可以将一个字符串转成python对象,不 ...

  7. 深度学习课程笔记（十四）深度强化学习 --- Proximal Policy Optimization (PPO)

    深度学习课程笔记(十四)深度强化学习 ---  Proximal Policy Optimization (PPO) 2018-07-17 16:54:51  Reference: https://b ...

  8. 【Git 使用笔记】第四部分：git在公司中的开发流程

    先声明几个变量 仓管A:主分支,只有master分支仓管B:开发分支,只有各个业务开发分支   仓管B fork 于 A 如下图 为了保证 代码的稳定性,只有 仓管B中的某个分支测试完毕并进行了代码r ...

  9. python3.4学习笔记(二十四) Python pycharm window安装redis MySQL-python相关方法

    python3.4学习笔记(二十四) Python pycharm window安装redis MySQL-python相关方法window安装redis,下载Redis的压缩包https://git ...

随机推荐

  1. Java虚拟机：类加载机制详解

    版权声明:本文为博主原创文章,转载请注明出处,欢迎交流学习! 大家知道,我们的Java程序被编译器编译成class文件,在class文件中描述的各种信息,最终都需要加载到虚拟机内存才能运行和使用,那么 ...

  2. 学习笔记TF028:实现简单卷积网络

    载入MNIST数据集.创建默认Interactive Session. 初始化函数,权重制造随机噪声打破完全对称.截断正态分布噪声,标准差设0.1.ReLU,偏置加小正值(0.1),避免死亡节点(de ...

  3. （转）mybatis常用jdbcType数据类型

    1 MyBatis 通过包含的jdbcType类型 BIT FLOAT CHAR TIMESTAMP OTHER UNDEFINED TINYINT REAL VARCHAR BINARY BLOB ...

  4. 【css】盒子模型 之 概述

    摘要 一些基本的概念以及常见使用问题 概述 BFC 是css 中布局的核心 - 盒模型,根据块级元素及行级元素可分为块级容器, 行级容器,但容器内部都遵循 BFC BFC 空间布局 备注: IE 的盒 ...

  5. 文科生细谈学习Linux系统的重要性

    首先大概介绍下自己,我学的是公共事业管理方面的专业,可以说是面向纯理论,社区管理社会管理的专业,但是从大二开始,对网络及服务器运维方面产生浓厚兴趣,并不断在网上找相关资料. 在这期间经历过很多,单说桌 ...

  6. c++文件编译的一些说明

    1,头文件只在于预处理阶段用于完全包含该头文件的内容,每个c文件是一个编译单元,类定义和类声明,变量和函数声明,类内联实现是内部链接,全局变量和函数的定义以及类外部实现是具有全局链接性,假设将所有c单 ...

  7. mysql常用sql命令

    一.连接MYSQL. 格式: mysql -h主机地址 -u用户名 -p用户密码 1.连接到本机上的MYSQL. 首先打开DOS窗口,然后进入目录mysql\bin,再键入命令mysql -u roo ...

  8. ABP+AdminLTE+Bootstrap Table权限管理系统第一节--使用ASP.NET Boilerplate模板创建解决方案

    "abp是ASP.NET Boilerplate简称,是一个用最佳实践和流行技术开发现代WEB应用程序的新起点,它旨在成为一个通用的WEB应用程序框架和项目模板" abp官方网站: ...

  9. iOS设置状态栏样式

    iOS设置状态栏样式可以使用两种方式. 方式一: 直接在需要改变默认状态栏样式的控制器中实现一个方法(其他任何事情都不用做): // 返回状态栏的样式 - (UIStatusBarStyle)pref ...

  10. 常用类：String，StringBuffer，StringBuilder

    String String类被final修饰符修饰,所以不能将其进行继承,所有对它的改变都要重新创建一个新的地址 1.String的构造器 String() String(byte []bytes)/ ...