HTML5(一)

Paste_Image.png
1.Html5元素
Paste_Image.png
Paste_Image.png
Paste_Image.png
Paste_Image.png
2.关于ie浏览器的兼容性
Paste_Image.png

没设置document.createElement(“”);前:

Paste_Image.png

设置document.createElement(“”);后:

Paste_Image.png
3.h5表单的元素
Paste_Image.png
Paste_Image.png
3.表单验证
Paste_Image.png

类似这样的例子

valueMissing输入值为空—用在type=”text”中

Paste_Image.png

typeMismatch控件值与预期类型不匹配

Paste_Image.png

patternMismatch输入值不满足pattern正则

Paste_Image.png

tooLong超过maxLength最大限制

Paste_Image.png

rangeUnderflow验证range最小值

Paste_Image.png

rangeOverflow验证range最大值

Paste_Image.png

setCustomValidity/customError:

Paste_Image.png
Paste_Image.png
4.新的选择器
Paste_Image.png

div1的一种方法

Paste_Image.png

div的一种方法

Paste_Image.png

.box的一种方法表示

Paste_Image.png

获取一组元素方法:

Paste_Image.png
5.获取class列表属性
Paste_Image.png

例子

Paste_Image.png
Paste_Image.png

add增加css,remove删除css:

例子
add:

Paste_Image.png
Paste_Image.png

remove:

Paste_Image.png
Paste_Image.png

toggle是切换classlist列表:下面增加了一个box4
例子

Paste_Image.png
Paste_Image.png

这里的toggle却删除了box2
例子

Paste_Image.png
Paste_Image.png
6.JSON的新方法
Paste_Image.png

Eval:

Paste_Image.png

Json:

Paste_Image.png

注意:

Paste_Image.png

递归深拷贝:

Paste_Image.png
Paste_Image.png

引进这个js才能兼容ie浏览器

Paste_Image.png

往后还会继续更新h5知识,谢谢阅读本人的文章,若有什么需要改正的,请指正,本人乐意改善

本文作者lilyping
越努力,越幸运
原文链接://www.greatytc.com/u/3908e601f4ec
微信公众号:BestLilyPing
github:https://github.com/lilyping
Demos源码地址:https://github.com/lilyping

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容