HTML5学习笔记简明版(7):新增属性(2)

dirname属性

input 和 textarea 元素有了一个新元素 dirname,用于用户所设置的提交的方向性的控制(译注,即书写的方向性,ltr或rtl)。

  1.  

登录后复制登录后复制登录后复制登录后复制登录后复制

用户提交的时候,浏览器会接收到3个参数,分别是:comment, comment.dir和mode,类似下面这样:comment=Hello&comment.dir=ltr&mode=add

如果是阿拉伯文的浏览器,输入的是阿拉伯文مرحبًا的话,那传回的参数就应该是这样的:

  1. comment=%D9%85%D8%B1%D8%AD%D8%A8%D9%8B%D8%A7&comment.dir=rtl&mode=add

登录后复制

textarea下的maxlength和wrap属性

textarea新增的maxlength和input的maxlength是一样的,都是限制最大长度的。

新增的wrap属性为枚举值(soft/hard),意思分别是:

hard:自动硬回车换行,换行标记一同被传送到服务器中去,必须与cols同时使用才能判断多少字符换行;

soft:自动软回车换行,换行标记不会传送到服务器中去

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

form下的novalidate属性

新增属性novalidate的意思是允许form表单不验证即可提交(不用管form里的元素是否有验证条件,例如required, min, max等)。

例子代码:

  1.  

登录后复制登录后复制登录后复制登录后复制登录后复制

还有一种用法是,同一个form里有多个submit按钮,可以针对某个按钮设置formnovalidate属性来忽略验证,例如:

  1.  

登录后复制登录后复制登录后复制登录后复制登录后复制

该form只有在点击Submit essay按钮的时候才验证表单,另外2个按钮不验证。

input与button下的新属性

input和button元素新增加了几个新属性(formaction, formenctype, formmethod, formnovalidate和formtarget),如果这些设置这些属性的话,那所对应的form属性值将被覆盖,即input或button所属的form元素的action, enctype, method, novalidate和target属性的值将被覆盖。

例子代码:

  1.  

登录后复制登录后复制登录后复制登录后复制登录后复制

menu下的type和label属性

menu 元素有了两个新属性:type 和 label。它们允许元素转化成典型用户界面里的菜单,并结合全局 contextmenu 属性提供上下文菜单。

style下的scoped属性

style 元素有了一个新的 scoped 属性,用来启用限定作用范围的样式表。在一个这样的 style 元素里的样式规则只应用到当前style元素的父元素根下的子树,即兄弟树。

  1.  
        

    Blah Title Blah

        

    Blah blah article blah blah.

             h1 { color: hotpink; } article { border: solid 1px hotpink; }     

    Blah Title Blah

        

    Blah blah article blah blah.

登录后复制

script下的async属性

async属性可以让script加载的脚步异步执行(即必须是src引用文件的形式才可以用),例如:

  1.  

登录后复制

有多种执行外部脚本的方法:

如果 async=”async”:脚本相对于页面的其余部分异步执行(当页面继续进行解析时,脚本将被执行)

如果不使用 async 且 defer=”defer”:脚本将在页面完成解析时执行

如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本

html下的manifest属性

html 元素有了一个新属性 manifest,指向一个用于结合离线Web应用API的应用程序缓存清单。

首先,需要先创建manifest文件

  1. CACHE MANIFEST#This is a commentCACHE #需要缓存的文件index.htmlstyle.cssNETWORK: #不需要缓存的文件search.phplogin.phpFALLBACK: #资源不可用的情况下,重定向的地址/api offline.html

登录后复制

然后加该文的地址加到html属性里:

  1.  

登录后复制登录后复制登录后复制登录后复制登录后复制

例子:http://www.mangguo.org/create-offline-html5-web-apps-in-5-easy-steps/

link下的sizes属性

link 元素有了一个新的属性 sizes。可以结合 icon 的关系(通过设置 rel 属性,可被用于如网站图示)一起使用来表明被引用图标的大小。因此允许了不同的尺寸的图标。

例子代码:

  1.  

登录后复制

ol下的reversed属性

ol 元素有了一个新属性 reversed。当其存在时,代表列表中的顺序为降序。

iframe下的sanddbox, seamless和srcdoc属性

iframe 元素有了三个新属性分别是 sandbox, seamless, 和 srcdoc,用以允许沙箱内容,例如,博客评论。

例子代码:

  1.  

登录后复制

Seamless:

登录后复制

video和audio的play属性

HTML5也使得所有来自HTML4的事件处理属性(那些形如 onevent-name 的属性)变成全局属性,并为其定义的新的事件添加了几个新的事件处理属性。比如,媒体元素(video 和 audio)API所使用的 play 事件。

以上就是HTML5学习笔记简明版(7):新增属性(2)的内容,更多相关内容请关注PHP中文网(www.php.cn)!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
编程技术

HTML5学习笔记简明版(8):新增的全局属性

2025-4-1 8:29:09

编程技术

HTML5学习笔记简明版(6):新增属性(1)

2025-4-1 8:29:18

0 条回复 A文章作者 M管理员
欢迎您,新朋友,感谢参与互动!
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
私信列表
搜索