8

我最近开始学习 JavaScript,但有些事情让我感到困惑:

Element.value 有什么区别Element.getAttribute("value")

实际上我的问题是,当我尝试将input类型为的元素的值复制text到另一个元素时,如果我使用第一种方法(Element.value)它工作正常,但如果我使用第二种方法它会复制给元素的第一个值并且当我更改里面的文本时它永远不会更新textbox,这种行为对我来说似乎很奇怪!你们能解释一下这里发生了什么吗?

<html>
<head>
    <meta charset="utf-8">
    <title>Hello JavaScript</title>
    <script src="script2.js"></script>
</head>
<body>
    <input id="Text1" type="text" />
    <input id="Button1" type="button" value="button" />
    <input id="Text2" type="text" />
</body>
</html>

JavaScript 文件:

var myButton;

window.onload = function () {

    myButton = document.getElementById("Button1");
    myButton.onclick = function () {
        var val = document.getElementById("Text1").getAttribute("value");  
        //var val = document.getElementById("Text1").value;
        document.getElementById("Text2").setAttribute("value", val);
    };

};
4

2 回答 2

9

不同之处在于它element.value是实时的,如果用户更改了文本框输入,它将反映这一点,并向您显示新值。

WhilegetAttribute('value')仍将显示原始value="whateverWasHere"值。

jsFiddle 演示

于 2013-07-05T17:52:02.177 回答
2

value属性的值是您在编写 HTML 时设置的值。

属性的值在读取时用于填充元素的value 属性

属性是您之后使用时得到Element.value的,并且是用户或大多数 JavaScript 函数更改的。当用户通过界面更改值时,属性不会更改。

简而言之,您几乎总是想使用Element.value并且几乎从不使用Element.getAttribute("value").

于 2013-07-05T17:51:03.390 回答