Dom属性和HTML属性的区别

w

遇到这个问题的可以先参考这一篇文章，能帮你很好的理解DOM和HTML两种属性的区别之处：https://blog.csdn.net/u014291497/article/details/50639628

在angular2以上的版本的学习当中，你也许会遇到这样的问题。例如代码：

<input type = "text" value = '123456' (input) = 'onInput($event)'>

要获取到input里的value值，在onInput方法中你可以通过这两种方法获取：

1.获取input的HTML的value属性

onInput(event){
    var val = event.target.getAttribute('value');
    console.log(val);
}

它的输出结果是

123456

当我们在输入框输入任何字符的时候，这个输出都不会改变。这是因为HTML属性是固定不会变的，只要你不用代码去更改它，它就永远是html初始化时候的初始值，也就是我们在input里面初始化的 value=“123456”;

2.获取dom属性值value

onInput(event){
    var val = event.target.value;
    console.log(val);
}

此时在输入框输入的字符串将会被console.log（val）；的代码句打印出来，这是因为DOM属性是动态的，它的值随着用户的输入的改变而改变。

以上就是我所理解的DOM属性和HTML属性的区别~