HTML5_提供的 新功能

HTML5_提供的 新功能

• js 操作
  • ele.classList
    • • 获取 <div id="ele" class="... ..."></div>列表
    • ele.classList.add("current");
    • ele.classList.remove("current");
    • ele.classList.toggle("current");    /* 删除返回 false */

• 元素 新属性
• conteneditable
  • 内容可编辑性
  • <div contenteditable="true"></div>

• HTML5 允许自定义属性，操作标签上的属性
• <div id="ele" data-warhorse="战马"></div>
  • 读自定义的属性
    • ele.getAttribute("data-warhorse");
    • ele.dataset.warhorse;
  • 写自定义的属性
    • ele.setAttribute("data-warhorse", "战马山庄");
    • ele.dataset.warhorse="战马山庄";

• <div id="ele" data-war-horse="战马"></div>
  • 读： ele.dataset.warHorse;
  • 写： ele.dataset.warHorse = "战马山庄";

• 属性分为
  • <> 标签上的属性 attributes
    • 读： ele.getAttribute("id");
    • 写： ele.setAttribute("id", "big_box");
    • 以后只要看到 Attribute，就是操作 <> 标签上的属性

• • 对象上的属性 var obj = {name:"kjf", age="18"}
    • 读： obj.name;    或者    obj["name"];
    • 写： obj.name="God";    或者    obj["age"]="180000";    
      • 动态添加属性： obj.addr="The Hell 1024.";

• • 有些属性 既是标签上的属性，也是对象上的属性
    • id
    • src

• HTML5 表单

1

HTML5_提供的 新功能

原文：https://www.cnblogs.com/tianxiaxuange/p/9974621.html