您好,欢迎访问一九零五行业门户网

DOM笔记(四):HTML 5 DOM复杂数据类型_html/css_WEB-ITnose

html 5 dom定义了一下集合、列表等复杂的数据类型用于实现便捷的操作。相对于html 4 dom,html 5 dom增加了htmlcollection、domtokenlist、domstringmap、htmlallcollection、 htmlformcontrolscollection等。
一、htmlcollection、htmlallcollection和htmlformcontrolscollection
     三个接口均用于表示一组元素组成的列表。htmlallcollection和htmlformcontrolscollection均继承自 htmlcollection接口,对htmlcollection接口中定义的nameditem()方法进行了重写。在dom笔记(一):htmldocument接口, 利用document.forms(/images/embeds等)返回一个htmlcollection对象,document.all则返回一个 htmlallcollection对象,document.forms.elements则返回一个 htmlformcontrolscollection对象,该对象包含了form中的所有表单元素。
属性或者方法 数据类型 说明
length long 只读,返回集合中的元素数量。三个接口均有此属性
item() object 1、根据索引获取集合中的元素。在htmlcollection中定义 2、在htmlcollection中有如下等价:
       document.forms(0)document.forms[0]document.forms.item(0)
tags() htmlallcollection 根据标签名获取元素。在htmlallcollection中定义
nameditem() object 根据name或者id属性获取集合中的元素,区别如下: 1、在htmlcollection中,先根据name查找,在根据id查找,但是只返回第一个符合的元素。若不存在符合的元素则返回null。存在如下等价:
document.forms['formname']document.forms(‘formname’)document.forms.nameditem(‘formname’)
2、在htmlallcollection中,若有多个符合的元素,则返回一个htmlcollection对象;若只有一个符合元素,则返回该元素。
3、在htmlformcontrolscollection中,若有多个符合的元素,则返回一个radionodelist对象;若只有一个符合元素,则返回该元素。
二、htmloptionscollection接口
     该接口返回一组元素组成的列表,与htmlcollection不同的是,它特定于返回的是一组option元素责成的列表,并且重写了length属性 和nameditem()方法。htmlselectelement.options属性返回的数据类型就是 htmloptionscollection。
属性或方法名 数据类型 说明
length long 可读写。若属性值大于实际的option元素个数,则htmlselectelement自动添加空的option元素;
若属性值小于实际的option元素个数,则htmlselectelement自动删除多余的option元素
add() void 插入一个option元素
nameditem() object 根据name或id获取集合中的元素
remove() void 删除一个option元素
三、domtokenlist和domsettabletokenlist
     domtokenlist表示空格隔开的一系列标识。在dom笔记(三):element接口和htmlelement接口中,htmlelement.classlist 属性返回的数据类型就是domtokenlist。domsettabletokenlist继承自domtokenlist,唯一不同的就是增加了 value属性。htmllinkelement.size返回的数据类型是domsettabletokenlist。
属性或方法 数据类型 说明
length long 集合中标识的数量
value domstring 获取或设置domtokenlist值
add() void 插入一个标识
contains() boolean 判断是否包含某标识
remove() void 删除一个标识
item() object 根据索引获取标识
toggle() boolean 标识存在则删除,不存在则添加
tostring() domstring 返回对象的字符串形式
四、domstringmap和nodelist
      domstringmap接口标示一些“键/值对”组成的集合,可以通过javascript语法对键值对进行删除、修改等操作。在dom笔记(三):element接口和htmlelement接口中,htmlelement.dataset属性返回的数据类型就是domstringmap
domstringmap
nodelist接口表示一系列节点组成的列表。document.getelementsbytagname()返回的是nodelist对象。其有一 个只读的length属性,用于返回节点的数量;还有一个item()方法,用于根据索引访问节点。有如下等价方式:
      nodelist.item(0) nodelist[0]nodelist(0)
其它类似信息

推荐信息