在 angular2 以上的版本的学习当中, 你也许会遇到这样的问题. 例如代码:
要获取到 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 属性的区别~
来源: https://www.2cto.com/kf/201809/777905.html