两者之间:
Javascript
function setCss(object, css) {
return (object.className = css);
}
function getCss(object, css) {
return object.className;
}
或者
function getCss2(object)
{
if (object.getAttribute("className")) {
return object.getAttribute("className");
}
return object.getAttribute("class");
}
function setCss2(object, cssclass)
{
if (object.getAttribute("className")) {
return object.setAttribute("className",cssclass);
}
object.setAttribute("class",cssclass);
}
HTML
<a href="#" onClick="setCss(this, 'newclass')" />
<a href="#" class="something" onClick="alert(getCss(this))" />
<a href="#" onClick="setCss2(this, 'newclass')" />
<a href="#" class="something" onClick="alert(getCss2(this))" />
这两个版本似乎都适用于 IE8、FF4、Chrome、Opera 和 Safari。 ( jsFiddle (improved) demo )
哪个是最佳使用实践,为什么?您是否遇到过这两个版本中的任何问题?
最佳答案
object.getAttribute("className");
实际上是行不通的。
区别在于getAttribute
获取 HTML 属性 的值,因为它是用 HTML 代码编写的(有一些异常(exception))。
这些值大多也是 DOM 元素属性的初始值。但由于预处理/后处理,访问它们可能会产生不同的值。
例如,如果您有一个 <a>
元素,el.href
给你完整的(绝对)URL,而 el.getAttribute('href')
为您提供在 HTML 中写入的 URL。
大多数时候,您想要访问 DOM 元素的属性,因为这些属性反射(reflect)了元素的当前状态。
关于javascript - object.className 或 object.getAttribute ("className/class")?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6574946/