html js 选择器,h.js - dom元素选择器

dom元素选择器

使用h(selector)可以快速的选择dom元素，支持下面几种选择方式：

1、id选择器

2、类选择器

3、标签选择器

4、原生对象选择器

选择器语法及返回语法: h('选择器')

参数: 对应类型的选择器

返回: h.js 特定的dom操作对象

id 选择器

语法 : h('#domId');

返回 : 选择成功返回h.js dom对象(注意该对象用于基于h.js的后续操作，原生的dom对象被保存在返回对象的dom属性中)，否则返回空对象。//选中返回

{"dom":[{}],"length":1}

//选择失败返回

{"dom":[],"length":0}

原生dom对象 :

返回对象的dom属性的第一个元素，示例:

var test = h('#test');

var dom  = test.dom[0];

dom.innerHTML = 'hi..';//只是一个例子 h.js就是简化原生dom操作的不需要这样执行

使用id选择器改变dom内容及颜色的例子：

12

var test = h('#test').html('hi').css({'color':'#900'});

类选择器

语法 : h('.className');

返回 : 选择成功返回h.js dom对象(注意该对象用于基于h.js的后续操作，原生的dom对象被保存在返回对象的dom属性中)，否则返回空对象。//选中返回

{"dom":[{}],"length":1}

//选择失败返回

{"dom":[],"length":0}

原生dom对象 : 返回对象的dom属性的第x个元素。

示例 :

12

12

h('.test').html('hi').css({'color':'#900'});

标签选择器

语法 : h('tagName');

返回 : 选择成功返回h.js dom对象(注意该对象用于基于h.js的后续操作，原生的dom对象被保存在返回对象的dom属性中)，否则返回空对象。//选中返回

{"dom":[{}],"length":1}

//选择失败返回

{"dom":[],"length":0}

原生dom对象 : 返回对象的dom属性的第x个元素。

示例 :

12

12

h('div').html('hi').css({'color':'#900'});

原生dom对象选择器

语法 : h(原生dom对象);

返回 : 选择成功返回h.js dom对象(注意该对象用于基于h.js的后续操作，原生的dom对象被保存在返回对象的dom属性中)，否则返回空对象。//选中返回

{"dom":[{}],"length":1}

//选择失败返回

{"dom":[],"length":0}

注意 : 只支持单个对象。

示例 :

12

12

h(document.getElementById('t1')).html('hi').css({'color':'#900'});