0

代码：

activeCell.onclick = function()
{
    console.log(element);
    element.value = this.value;
    console.log(element.value);
    console.log(element);
};

假设activeCell是一个值 = "678"的跨度，但元素只是一个简单的输入标签 ()

<input id="calendar" value="123" />

输出：

<input id="calendar" value="123">
678
<input id="calendar" value="123">

字符串123被替换为678，但输入标签值保持不变。但是，当使用方法 setAttribute 时，输出值会发生变化：

element.setAttribute("value", this.value);

从那以后我一直在使用element.value = XXX并且它有效......有什么区别？

4

1 回答 1

0

根据您的示例，“值”属性是元素类型“输入”的预定义属性，但不是元素类型“跨度”的预定义属性。所以根据你的功能

<input id="calendar" value="123">
    <span id="activeCell">678</span>

document.getElementById('activeCell').onclick = function(){
    element = document.getElementById('calendar');
    console.log(element);
    element.value = this.value; // Here this object doesn't have the property value hence it will be assigned with value as undefined;
    console.log(element.value);
    console.log(element);
};

"this" object referring to the Span element does not have the property `"value"` by default hence it returns undefined. It is not the case with the setAttribute method.

在 setAttribute 方法中，您可以为任何属性分配任何值。基本功能是检查该对象的属性堆栈，如果找到您提到的属性，则为其分配值。如果在属性堆栈中找不到该属性，则它会使用您指定的名称为该对象创建新属性，并为其分配值。

所以 document.getElementById('activeCell').setAttribute('value',"102"); 它使用 102 分配属性值。

希望这可以帮助您理解

于 2013-10-31T10:31:17.837 回答