首页前端开发JavaScripthtml之table和select操作(介绍)

html之table和select操作(介绍)

时间2024-01-28 21:39:03发布访客分类JavaScript浏览769
导读:收集整理的这篇文章主要介绍了html之table和select操作(介绍),觉得挺不错的,现在分享给大家,也给大家做个参考。本章给大家带来htML之table和select操作(介绍),有一定的参考价值,有需要的朋友可以参考一下,希望对你有...
收集整理的这篇文章主要介绍了html之table和select操作(介绍),觉得挺不错的,现在分享给大家,也给大家做个参考。本章给大家带来htML之table和select操作(介绍),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

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了。

以上就是html之table和select操作(介绍)的详细内容,更多请关注其它相关文章!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

无序列表...html之table和select操作(介绍) 发布时间:2022-05-16 发布网站:脚本宝典脚本宝典收集整理的这篇文章主要介绍了html之table和select操作(介绍)脚本宝典觉得挺不错的现在分享给大家也给大家做个参考。本章给大家带来htselecttabletable###无序列表猜你在找的JavaScript相关文章 html font标签如何设置字体大小?html font标签属性用法介绍2022-05-16vue3+TypeScript+vue-router的使用方法2022-04-16vue3获取当前路由地址2022-04-16如何利用React实现图片识别App2022-04-16JavaScript展开运算符和剩余运算符的区别详解2022-04-16微信小程序中使用vant框架的具体步骤2022-04-16Vue elementUI表单嵌套表格并对每行进行校验详解2022-04-16如何利用Typescript封装本地存储2022-04-16微信小程序中wxs文件的一些妙用分享2022-04-16JavaScript的Set数据结构详解

若转载请注明出处: html之table和select操作(介绍)
本文地址: https://pptw.com/jishu/590191.html
安装html-webpack-plugin插件时报错以及处理办法 html文档如何解析?详解解析过程

游客 回复需填写必要信息