元素值和数据属性有什么区别？

element value 属性指定 HTML 元素的默认值，而 data 属性允许您在其他 HTML 属性无法这样做时将额外数据存储到 HTML 中的标签中。

元素值： HTML 元素是开始和结束标记的集合，它们之间插入内容。

例子：

HTML

  


   Website: 
       

输出：

元素值

数据属性：数据属性允许您将自己的信息添加到 HTML 中的标签。尽管名称另有暗示，但这些并非特定于 HTML5

例子：

HTML

   function showDetails(vehicle) {
     var vehiclePrice = 
         vehicle.getAttribute("data-vehicle-price");
     alert(vehicle.innerHTML 
           + " is of cost " +  vehiclePrice + ".");
   }
 
 
    h1{
      color:green;
    }
    li{
      margin-top:5px;
      cursor:pointer;
    }
  


  Vehicle 
    
Click on a vehicle to see how much it Cost:
   
  
        
     Bike
   
     Car  
   
     Truck  
  

                    

输出：

           

Element Value	Data Attribute
The element value can be implemented using HTML elements , ,, ,,and elements only.	The data attribute can be used with all HTML elements.
It is used differently for different elements. For example, the , elements values specifies the initial value of the element.   For elements, the value attribute specifies the value of the parameter.	It is used to define custom data attributes and to store custom data, private to the page or application.
For element value, we don’t need to give any name to it. The value must be a string.	The attribute name cannot have any uppercase letters, and must be at least one character long and the prefix with ‘data-‘.