1、 required="required" 不为空
2、 placeholder="Search W3School" 希望输入的值
3、 pattern="[A-z]{3}" title="Threeletter country code" 输入三个字母
4、 novalidate="novalidate" 不进行验证
5、 multiple="multiple" 可以选择多个文件
6、 min="0" max="10" step="3" 输入介于0-10 之间3的倍数
7、
Webpage:<input type="url" list="url_list" name="link"/>
<datalist id="url_list">
<optionlabel="W3School" value="http://www.w3school.com.cn" />
<optionlabel="Google" value="http://www.google.com" />
<optionlabel="Microsoft" value="http://www.microsoft.com" />
</datalist>
Input 下拉列表
8、
<formaction="/example/html5/demo_form.asp" method="get"id="user_form">
First name:<input type="text"name="fname" />
<input type="submit" />
</form>
<p>下面的输入域在 form 元素之外，但仍然是表单的一部分。</p>
Last name: <input type="text"name="lname" form="user_form" />
提交会提交form 为user_form的
9、onforminput 使用 output 元素的简易计算器
10、<inputtype="date" name="user_date" /> 日期属性
11、Points: <inputtype="range" name="points" min="1"max="10" />
12、<inputtype="number" name="points" min="1"max="10" />
13、autocomplete="on"表单的自动完成功能
14、
<!DOCTYPE HTML>
<html>
<head>
<style type="text/css">
#div1, #div2
{float:left; width:100px; height:35px;margin:10px;padding:10px;border:1px solid #aaaaaa;}
</style>
<scripttype="text/javascript">
function allowDrop(ev)
{
ev.preventDefault();
}
function drag(ev)
{
ev.dataTransfer.setData("Text",ev.target.id);
}
function drop(ev)
{
ev.preventDefault();
vardata=ev.dataTransfer.getData("Text");
ev.target.appendChild(document.getElementById(data));
}
</script>
</head>
<body>
<div id="div1"οndrοp="drop(event)" οndragοver="allowDrop(event)">
<img src="/i/w3school_logo_black.gif"draggable="true" οndragstart="drag(event)"id="drag1" />
</div>
<div id="div2"οndrοp="drop(event)"οndragοver="allowDrop(event)"></div>
</body>
</html>
拖拽
15、
<scripttype="text/javascript">
if (localStorage.pagecount) {
localStorage.pagecount=Number(localStorage.pagecount)+1;
}else{
localStorage.pagecount=1;
}
document.write("Visits: " +localStorage.pagecount + " time(s).");
</script>
<p>刷新页面会看到计数器在增长。</p>
16、
<scripttype="text/javascript">
localStorage.lastname="Smith";
document.write("Last name: " +localStorage.lastname);
</script>
最后一次的值
17、manifest="/example/html5/demo_html.appcache"离线缓存
18、
<h1>获得服务器更新</h1>
<div id="result"></div>
<script>
if(typeof(EventSource)!=="undefined"){
varsource=new EventSource("/example/html5/demo_sse.php");
source.onmessage=function(event) {
document.getElementById("result").innerHTML+=event.data +"<br />";
};
}else {
document.getElementById("result").innerHTML="Sorry, yourbrowser does not support server-sent events...";
}
</script>
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
