如何让JavaScript输出HTML数据时去除引号，获取纯数字值？

问题场景 #

你通过div.dataset.myattribute获取到的是字符串类型的"10"，需要转换为纯数字10，以下是几种常用方法：

• 使用Number()函数转换
  直接把获取到的字符串传入Number()函数，即可转为数字：

  const div = document.getElementById("zoomsize");
  const numValue = Number(div.dataset.myattribute);
  console.log(numValue); // 输出纯数字10
  

• 使用一元加号+转换
  在字符串前添加一元加号，是更简洁的转换方式：

  const div = document.getElementById("zoomsize");
  const numValue = +div.dataset.myattribute;
  console.log(numValue); // 输出纯数字10
  

• 使用parseInt()或parseFloat()（适配整数/浮点数场景）
  如果确定是整数，用parseInt()；如果可能是浮点数，用parseFloat()：

  const div = document.getElementById("zoomsize");
  // 整数场景
  const intValue = parseInt(div.dataset.myattribute, 10);
  console.log(intValue); // 输出10
  // 浮点数场景（按需使用）
  const floatValue = parseFloat(div.dataset.myattribute);
  console.log(floatValue); // 输出10
  

补充说明 #

从dataset获取的所有属性值默认都是字符串类型，这是HTML data属性的特性，因此必须通过类型转换才能得到数字。

内容的提问来源于stack exchange，提问作者Ruth