javascript - 何时访问属性(相对于属性)?

标签 javascript html

我收集自 this post 几乎总是人们想要访问 DOM 属性,而不是 HTML 属性。

那么罕见的有用异常是什么?在什么情况下访问 HTML 属性比访问 DOM 属性更好?

最佳答案

有时属性不会映射到属性中的更改。

一个例子是复选框的 checked 属性。

演示: http://jsfiddle.net/mxzL2/

<input type="checkbox" checked="checked"> change me

document.getElementsByTagName('input')[0].onchange = function() {

    alert('attribute: ' + this.getAttribute('checked') + '\n' +
          'property: ' + this.checked);
};

...而 ID 属性/特性将保持同步:

演示: http://jsfiddle.net/mxzL2/1/

<input type="checkbox" checked="checked" id="the_checkbox"> change me

var i = 0;

document.getElementsByTagName('input')[0].onchange = function() {

    this.id += ++i;
    alert('attribute: ' + this.getAttribute('id') + '\n' +
          'property: ' + this.id);
};

而且自定义属性通常根本不映射。在这些情况下,您需要获取该属性。


也许更有用的案例是文本输入。

<input type="text" value="original">

...其中属性不随 DOM 或用户的更改而更改。


@Matt McDonald 所述,有些 DOM 属性会为您提供反射(reflect)原始属性值的初始值。

HTMLInputElement.defaultChecked
HTMLInputElement.defaultValue

关于javascript - 何时访问属性(相对于属性)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7588846/

相关文章:

javascript - 修改数组中的子项

javascript - 处理西里尔编码的 Node js有什么问题

html - 为什么我的页脚不粘?

python - 以柱状格式打印数据的最佳方式?

javascript - Bootstrap 一个带两个轮播指示器的轮播

javascript - 如何获得随机生成器结果的换行符?

javascript - 菜单栏下推正文,链接未正确对齐

javascript - 在不丢失事件监听器的情况下克隆Node

javascript - 使用 imageData 获取第一行和最后一行像素

html - 在 anchor 标记内添加中断(使用 CMS)