• 本文目录导读：
• 1、 概念定义
• 2、 使用方法
• 3、 应用场景
• 4、 总结

在JavaScript中，属性和特性是两个非常重要的概念，但是它们经常被混淆或者误用。本文将从概念定义、使用方法、应用场景等方面详细介绍JavaScript中属性和特性的区别。

1. 概念定义

在JavaScript中，每个对象都有一组“名称-值”对，这些名称-值对称为对象的“成员”。其中，“名称”即为对象成员的“键”，而“值”则是该键所对应的数据。这些数据可以分为两类：属性和特性。

属性指的是对象自身就具备且可读写修改的数据。比如说，在一个HTML元素节点上设置了`class`或者`id`等属性，在JS代码里可以通过`.className`或`.id`来访问或修改这些属性。

特性则指代表着HTML元素节点状态、行为以及内容展示形式等信息，并不一定直接反映在DOM上。比如说，在一个HTML输入框上设置了`value`、 `disabled `以及 `readonly `三个特性，如果需要获取其当前状态，则需要使用`.getAttribute()`方法获取相应值。

2. 使用方法

在JS代码里操作元素时，我们通常会涉及到获取/设置某个元素节点上某个具体信息（如样式、属性、特性等）。这时候，我们会使用`.getAttribute()`和`.setAttribute()`两个方法进行操作。

getAttribute()用于获取元素节点上的特性值。比如：

“`

var input = document.getElementById(‘myInput’);

var disabledValue = input.getAttribute(‘disabled’);

setAttribute()用于设置元素节点上的属性值。比如：

input.setAttribute(‘class’, ‘new-class’);

3. 应用场景

在实际开发中，我们需要根据具体需求来灵活应用属性和特性。

应用场景1：样式修改

如果需要修改某个元素节点的样式，那么直接通过JS代码来操作该元素节点上对应的CSS属性即可。比如：

var div = document.getElementById(‘myDiv’);

div.style.backgroundColor = ‘red’;

div.style.width = ‘100px’;

此时，我们并不涉及到任何HTML特性或者属性的修改。

应用场景2：表单提交

当用户填写完表单后提交数据时，我们通常会使用JS代码来获取该表单中各个输入框当前状态（是否选中/已填写等），然后将这些状态打包成JSON格式传递给服务端进行处理。此时，我们需要通过`.getAttribute()`方法获取相应输入框上的信息，并整合为JSON对象返回给服务端。

4. 总结

JavaScript中属性和特性是两个非常重要的概念，它们分别代表着对象自身可读写的数据和HTML元素节点的状态、行为以及内容展示形式等信息。在实际开发中，我们需要灵活应用属性和特性，根据具体需求来选择合适的获取/设置方法。