元素的属性
获取和设置HTML属性文本
var disabled = nodelib.attr(node,"disabled"); nodelib.attr(node,"disabled","");
获取和设置DOM对象属性
var disabled = nodelib.prop(node,"disabled"); nodelib.prop(node,"disabled",false);
工具函数列表
uDOMlib所提供的工具函数之中,有一部分与元素属性相关,下面列出部分函数的源代码实现以供参考。
attr
获取或设置元素的attribute(HTML标签属性)值。
attr: function(node,name, value) { if (value === undefined){ if (typeof name === "object"){ for (var attr in name){ this.attr(node,attr,name[atrr]); } return this; } else { return node[name]; } } else { node[name] = value; return this; } }
data
获取或设置元素给定名称的数据存储的值。
data: function(node,name, value) { var attrName = 'data-' + name.replace(capitalRE, "-$1").toLowerCase() if (value === undefined){ var data = this.attr(node,attrName,value); return data !== null ? deserializeValue(data) : undefined; } else { return this.attr(node,attrName,value); } }
html
获取或设置元素的Html内容。 html()内部使用DOM节点的innerHTML属性,适用于任意HTML元素。
html: function(node,html) { if (html === undefined){ return node.innerHTML; } else { this.empty(node); node.innerHTML = html; //TODO:will be checkd return this; } }
prop
获取或设置元素的property(特性)值。 prop()方法返回的是节点作为一个JavaScript对象所拥有的特性(property)值。 与attr()方法不同,prop()返回的值具有其本来的数据类型,如针对<input type=“checkbox”/>元素调用prop(“checked”),其返回值将是Boolean型的true或false。
prop: function(node,name, value) { name = propMap[name] || name; if (value === undefined){ return node[name]; } else { node[name] = value; return this; } }
removeAttr
removeAttr: function(node,name) { name.split(' ').forEach(function(attr) { setAttribute(node, attr); }); return this; }
text
获取或设置元素的文本内容。 .text() 方法不能使用在input元素或scripts元素上。 input 或 textarea 需要使用 .val() 方法获取或设置文本值。得到scripts元素的值,使用.html()方法
text: function(node,text) { if (text === undefined){ return node.textContent; } else { node.textContent = text == null ? '' : '' + text return this; } }
val
获取或设置元素的当前值。 val()方法主要适用于表单元素,如input, select 和 textarea。 如果select元素设置了multiple属性,.val()返回一个包含每个选择项值的数组
val: function(node,value) { if (value === undefined){ if (node.multiple) { // select multiple values var selectedOptions = this.find(node,"option").filter(function(){ return this.selected }); return this.pluck(selectedOptions,"value"); } else { return node.value; } } else { node.value = value; return this; } }