如何设置任何DOM元素的显示值
How do you set the display value of any DOM element?
有时我想更新一个随机DOMNode的值,但我真的不知道它是什么类型的元素。我假设我需要一些代码块来检查它是什么类型的节点。
if(el.tagName == 'input' ) el.value = "foo";
if(el.tagName == 'div') el.innerHTML = "foo";
或者即使某些属性存在:
var value = "foo";
if(el.value != "undefined" && el.value != value) {
el.value = value;
}
if(el.innerHTML != "undefined" && el.innerHTML != value) {
el.innerHTML = value;
}
el。nodeType确实列出了几个基本类型,但它们只是基本的节点类型。
更新任何类型的元素显示的最佳方法是什么?
Update: @dfsq有一个好主意。
el["value" in el ? "value" : "innerHTML"] = value;
然而,它似乎并不适用于任何元素:
["value" in document.createElement('li')] // true
更新2严格类型检查可能是一个解决方案:
document.createElement('input').value
""
document.createElement('li').value
0
document.createElement('div').value
undefined
document.createElement('textarea').value
""
注意:没有jQuery解决方案,除非你想指出jQuery是如何做到的
似乎对el.value
进行类型检查是可行的:
var els = ['p', 'div', 'li', 'a', 'input', 'textarea'];
for (var i in els) {
var el = document.createElement(els[i]); el.value = 'foo'; console.log(el.value);
}
jsfiddle
el[typeof el.value === "string" ? "value" : "innerHTML"] = value;
相关文章:
- 在单击任何位置时隐藏元素,而不检查每次DOM单击
- 是否有任何snippet或jQuery插件可以列出easylist.txt模式匹配的DOM中的所有元素
- 在不使用JQuery的情况下隐藏DOM中的选定元素
- 如何在DOM元素上按类型构建此函数
- DOM元素和angular元素之间的主要区别是什么
- 当带有渲染器的DOM元素不在屏幕顶部时,移动了场景的坐标
- 如何使用JavaScript在没有html dom的情况下隐藏html元素
- 使用jquery创建dom元素会导致ie9出现拒绝访问错误
- 通过AJAX侦听向DOM添加某些元素
- 如何在使用Ractive.extend()时引用DOM元素
- 在d3中向DOM元素添加了图像,但现在它赢得了't过渡
- Selenium无法在浏览器DOM中定位元素
- 如何'剪切'DOM元素并将其显示在其他位置
- 转换<a>使用jQuery将文本字符串转换为dom元素
- 从dom中删除任何元素后,Touchmove事件停止触发
- d3在数据更新时错误地附加了dom元素
- 访问VueJS中的DOM元素
- 在Meteor中如何查找DOM元素(渲染后)
- 找到元素DOM的根节点(阴影或光)的最佳方法是什么?
- 在querySelector:如何获得第一个和最后一个元素?dom中使用的遍历顺序