zoukankan      html  css  js  c++  java
  • Dom操作——创建标签

    一、找到标签

    直接找:

      document.getElementById(‘id’);  //找到一个固定对象

      document.getElementsByClassName('classname');  //找到多个对象,返回数组

      document.getElementsByTagName('tag');  //找到多个对象,返回数组

      document.getElementsByName("name");  //找到多个对象,返回数组

    间接找:

      parentNode          // 父节点

      childNodes          // 所有子节点
      firstChild          // 第一个子节点
      lastChild           // 最后一个子节点
      nextSibling         // 下一个兄弟节点
      previousSibling     // 上一个兄弟节点
     
      parentElement           // 父节点标签元素
      children                // 所有子标签
      firstElementChild       // 第一个子标签元素
      lastElementChild        // 最后一个子标签元素
      nextElementtSibling     // 下一个兄弟标签元素
      previousElementSibling  // 上一个兄弟标签元素
     
    二、创建节点 
      document.createElement('div');  //创建标签节点
      document.createTextNode("你好呀!!")  //创建文字节点
     
    三、插入节点
      appendChild(Node);  //在父级标签最后追加节点
      insertBefore(NewNode,oldNode);  //在任意地方插入节点
     
    四、删除节点
      removeChild(node);
     
    五、替换节点
      replacechild(Newnode,oldNode);
     
    六、文档碎片
      createDocumentFragment(); //提高js执行效率,相当于div包围,只是没有标签
     
    七、Dom对表格对象的操作
      var table = document.createElement("table");
    /////////注意表格结构标准就是,caption、head、foot、body  
      table.createCaption();  //创建描述 
      table.createTHead();  //创建表头
      table.createTFoot();  //创建表底
      table.createTBody();  //创建身体
    ///////////////在body中插入行
      insertRow()  //这是插入一行
      insertRow(i)   //还可以插入行号,注意行号从零开始计算
        配合rows[i]使用
    /////////////在行中插入单元格
      insertCell()  //这是插入一个单元格
      insertCell(j)  //同样可以插入标号
        配合cells[j]使用
     
    ///////删除相关
      deldexxxxx()
     
    九九乘法表实例:
      
     
  • 相关阅读:
    SQL查询效率注意事项 2011.12.27
    MSSQL2005数据库快照(SNAPSHOT)初探
    恢复Intellij idea删除的文件
    因样式冲突引起的div消失问题
    C# 用面向对象的思想去编程
    C# Combobox联动
    C#端加载数据库,Combobox与Node控件绑定数据源demo示例
    数据库无法打开到SQL Server连接
    SQLServer2008 远程过程调用失败
    将.db文件导入SQLServer2008数据库
  • 原文地址:https://www.cnblogs.com/yz9110/p/8829435.html
Copyright © 2011-2022 走看看