发生了什么.setAttribute vs .attribute =? [英] What is happening behind .setAttribute vs .attribute=?

查看:135
本文介绍了发生了什么.setAttribute vs .attribute =?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

说明:

我使用简单的 javascript 来设置值一个输入。我使用的方法似乎相同但结果不同。以下是一个示例:

I am using simple javascript to set a the value of an input. I am using multiple methods that appear to be the same but with different results. Here is an example:

HTML:

<input name="testinput" value="" type="text" />

Javascript:

var input = document.getElementByTagName('input')[0];
input.value = "5"

console.log(input.value) // returns "5"
console.log(input.getAttribute("value")) // returns ""

当使用 setAttribute时,功能如果颠倒了()功能。然而,当在表单提交时,他们都给出 input = 5 结果。

Of course the functionality if reversed when using the setAttribute() function. Yet, when on form submit they both give a input=5 result.

问题:

将两个属性分开是什么意思? .value 的存储方式是否与 .getAttribute(value)不同?

What is the point of separating the two properties? is the .value stored differently than the .getAttribute("value")?

免责声明:

我看过:

  • When to use setAttribute vs .attribute= in JavaScript?
  • Setting a property via property or setAttribute

这些问题/答案都让我感到困惑并且不满意。

Both of those question/answers left me confused and unsatisfied.

推荐答案

input.value 是点符号,它设置<$输入对象的c $ c> value 属性

input.value is dot notation, it sets the value property of the input object.

它不会更新任何属性,因此尝试获取具有相同名称的属性 返回更新后的值。

It does in no way update any attributes, so trying to get an attribute with the same name will not return the updated value.

如果由于某种原因你必须更新属性,你会做

If for some reason you have to update the attribute, you would do

input.setAttribute('value', 'new_value');

但您不必使用它,因为您通常应该使用属性,而不是属性,你设置并获得属性,而不是属性。

but you shouldn't have to use that, as you generally should be working with the properties, not the attributes, and you'd set and get the value property, not the attribute.

HTML中的属性是开始和结束括号内的键/值对,如

An attribute in HTML is a key / value pair inside the opening and closing brackets, as in

<div attribute="attribute_value"></div>

在许多情况下,此类属性将设置基础属性的初始值,并且属性是命名的带有值的键,附加到元素的内部模型,这是我们使用javascript访问的对象,持有模型的对象和元素的数据。

In many cases such attributes will set the initial value of the underlying property, and the property is a named key with a value, that is attached to the internal model of an element, which is what we access with javascript, the object holding the model and data for the element.

更改任何对象键或值不会更改HTML,只会更改元素的内部表示形式,即对象。但是,更改HTML属性在某些情况下会更改元素的对象表示。

Changing any of that objects keys or values does not change the HTML, only the internal representation of the element, the object. However, changing the HTML attributes will in some cases change the object representation of the element.

getAttribute 获取实际值来自HTML的属性,而不是属性,而 element.value 清楚地访问表示该元素的对象中的命名属性。

getAttribute gets the actual attributes from the HTML, not the properties, while element.value clearly accesses a named property in the object representing that element.

这篇关于发生了什么.setAttribute vs .attribute =?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆