对HTML5新增JS Api的思考

1.为什么javascript的变量名不使用css中的命名方法,而选择使用驼峰命名法

因为在javascript中“-”表示减法,所以如果使用“-”的话会出现不必要的问题。

2.在javascript中已经有className方法添加类名,为什么还要新增加classList.add方法

因为classList提供了对DOM元素类型判断,字符串处理,正则表达式匹配而className功能不够完善。

p.classList.length ; // 获取p元素中类名数量
p.classList.item(1); // 获取p元素中索引为1的类名
p.classList.add("big"); // 向p元素中添加big类
p.classList.remove("big"); // 将big类从p元素中移除
p.classList.contains("big"); // 判断p元素中是否包含名为big的类
p.classList.toggle("big"); // 如果p元素中存在big类,则将其删除;如果p元素中不存在big类,则向p中添加big类

classList的缺点
只能对单个类名进行操作,如果add,remove,contains,toggle方法中的类名参数包含空格,方法调用会报错

3.在js中可以自定义添加属性为什么还要有data添加自定义属性,他们有什么区别。
方便管理

时间: 2024-11-09 00:45:27

对HTML5新增JS Api的思考的相关文章

HTML5新增的API

6.1 特性 1.设置.读取方便.页面刷新不丢失数据 2.容量较大,sessionStorage约5M.localStorage约20M 4.只能存储字符串,可以将对象JSON.stringify() 编码后存储 6.2 window.sessionStorage 1.生命周期为关闭浏览器窗口 2.在同一个窗口(页面)下数据可以共享 6.3 window.localStorage 1.永久生效,除非手动删除 关闭页面也会存在 2.可以多窗口(页面)共享(同一浏览器可以共享) 6.4 方法详解 s

HTML5新增Canvas标签及对应属性、API详解(基础一)

知识说明: HTML5新增的canvas标签,通过创建画布,在画布上创建任何想要的形状,下面将canvas的API以及属性做一个整理,并且附上时钟的示例,便于后期复习学习!Fighting! 一.标签原型 <canvas width=”1000” height=”1000” id=”myCanvas”> 您的浏览器版本过低,不支持HTML5新增的canvas标签. </canvas> 使用js获取该画布,并指定对象 <script> Var canvasID = doc

HTML5新增的语义元素、JS常用对象

HTML5新增的语义元素 <header>元素表示页面中一个内容区域或整个页面的标题,通常他可能是一个页面中的(指主体标记中的第一个元素),可以包含站点的标题.Logo和旗帜广告 <header> <img src="logo.png"> <h1>YEN的Java Web之路</h1> </header> <footer>元素表示整个页面或页面中一个区域块的脚注,通常包含一些基本信息,包括一些基本信息:

HTML5 学习笔记(二)——HTML5新增属性与表单元素

目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placeholder占位属性 1.7.required必填属性 1.8.pattern正则属性 1.9.autofocus自动聚焦属性 1.10.autocomplete自动完成属性 1.11.novalidate不验证属性 1.12.multiple多选属性 二.HTML5表单新功能解析 2.1.表单结构更自由

html5新增及废除属性

html5中,在新增加和废除很多元素的同时,也增加和废除了很多属性. 一.新增属性 1.表单属性 a.autofocus 对input[所有类型].select.textarea与button指定autofocus属性.它以指定属性的方式让元素在页面加载后自动获得焦点.一个页面只能有一个元素有autofocus属性,同时设置多个,则第一个生效. 这个属性对登录页面很有用,可提升用户体验,有时登录页面就一个用户名,密码,页面加载后用户要手动定位到输入框,才能输入,有了autofocus,页面打开即

HTML5 学习总结(二)——HTML5新增属性与表单元素

一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="div1" style="height:900px; backgrou

HTML5学习总结——HTML5新增属性与表单元素

一HTML5新增属性 1.1contcxtmcnu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div id="div1" style="height:900px; background

使用HTML5的JS选择器操作页面中的元素

上一篇文章介绍了HTML5新增的JavaScript选择器,今晚正式实践一下,使用HTML5的JS选择器操作页面中的元素. 文件命名为:querySelector.html,可在Chrome浏览器中预览效果. 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>使用HTML5的JS选择器操作页面中的元

【高德地图API】从零开始学高德JS API(七)——定位方式大揭秘

摘要:关于定位,分为GPS定位和网络定位2种.GPS定位,精度较高,可达到10米,但室内不可用,且超级费电.网络定位,分为wifi定位和基站定位,都是通过获取wifi或者基站信息,然后查询对应的wifi或者基站位置数据库,得到的定位地点.定位数据库可以不断完善不断补充,所以,越定位越准确.本文详细描述了,如果使用高德JS API来实现位置定位.城市定位的方法,包含了IP定位,浏览器定位,检索定位等多种网络定位方法.当然,如果您的手机有GPS功能,那么使用浏览器定位的时候,会自动获取GPS信息,使