html之table&select不为人知的操作

时间:2020-12-07 03:14:03

table标签和其它标签不一样,他有属性和方法!

table属性:

  rows      可以得到table的row集合

  cells      得到table所有单元格

table方法:

  insertRow()       创建一个row并且添加到rows集合中

  deleteRow(index)    从表格中删除指定行

  moveRow(tr,index)  将行移动

tr属性:

  cells     得到tr中所有单元格的集合

  sectionRowIndex   得到该行在rows中的编号

tr方法:

  insertCell   在tr中创建并且添加到tr的cells中

  deleteCell(index)  删除指定index的cell 

那能干什么?能干什么?干什么?什么???

select:

  联动列表?没错,你终于知道你为什么不会做联动列表了。

  //首先就是为需要联动的select添加联动绑定

  <select name="" id="select_1" onChange="choose()">

    <option value="val_1">val_1</option>

  </select>

  //下面是第二级

  <select name="" id="select_2">

    //默认的下拉列表,保持和第一级一致 

  </select>

  //绑定的联动函数

  

    function change(){
      var select_1 = document.getElementById("select_1");
      var select_2 = document.getElementById("select_2");
      //最重要的就是清除第二级下拉列表
      select_2.length =0;
      //根据第一级联动的value来添加
      if(select_1.value == ""){
        //创建一个option
        var op = new Option("value","inner");
        //添加到第二级下拉
        select_2.add(op);
      }else if(){ //其他项目

      };
    };

  没错,就是利用length清空下拉列表,然后通过new Option()新建的下拉项,然后通过select的add()依次添加就ok了。

  本篇完。