javascript中的html输入值

我似乎无法解决我的这个问题：

<script>
    function getValues(){
        var value1 = document.getElementById("value1");
        var value2 = document.getElementById("value2");
        var value3 = document.getElementById("value3");
        alert(value1 +" "+ value2 +" "+ value3);
    }
</script>

<p>value1</p>   
<input type="text" id='value1' />
<p>value2</p>
<input type="text" id='value2' />
<p>value3</p>
<input type="text" id='value3' />
<input type="button" value="submit" onclick="getValues()" />

我尝试获取用户填写的值，然后向他们发出警报，但不是显示他们填写的值，而是显示：

[object HTMLInputElement][object HTMLInputElement][object HTMLInputElement]

有人知道问题出在哪里吗？

像这样试试看

function getValues(){

        var value1 = document.getElementById("value1").value;
        var value2 = document.getElementById("value2").value;
        var value3 = document.getElementById("value3").value;
        alert(value1 +" "+ value2 +" "+ value3);
    }

var value1=document.getElementByIdvalue1

获取与value1 Id关联的DOM元素。要获取元素的值，需要执行以下操作：

var value1=document.getElementByIdvalue1.value

document.getElementByIDValue1返回dom元素

要分配该值，请按如下方式使用该值：

document.getElementById("value1").value

---

解释为什么要添加.value有助于我更好地理解它。非常感谢。