获取html中某些标签的值
2024-08-24 06:00:43
一、获取单选按钮radio的值
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>获取input单选按钮radio的值</title>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js"></script>
</head>
<body>
<input type="radio" name="age" value="18" />小于18岁
<input type="radio" name="age" value="18-40" checked="checked" />18-40岁
<input type="radio" name="age" value="40" />40以上
<script>
var item = null;
var obj = document.getElementsByName("age")
for (var i = 0; i < obj.length; i++) { //遍历Radio
if (obj[i].checked) {
item = obj[i].value;
}
}
console.log(item)
</script>
</body>
</html>
二、获取table表格每行每列的数据
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>获取table表格每行每列的数据</title>
<style>
#tbl {
width: 40%;/*表格宽度*/
border-collapse: collapse;/*表格单边框*/
text-align: center;/*单元格文本居中显示*/
}
</style>
</head>
<body>
<form id="form1">
<div>
<table id="tbl" border="1">
<tr>
<td> 11</td>
<td> 12</td>
<td> 13</td>
<td> 14</td>
</tr>
<tr>
<td> 21</td>
<td> 22</td>
<td> 23</td>
<td> 24</td>
</tr>
<tr>
<td> 31</td>
<td> 32</td>
<td> 33</td>
<td> 34</td>
</tr>
</table>
</div>
</form>
<script>
function load(){
var tab=document.getElementById("tbl");
var rows=tab.rows;
console.log(rows.length);//获取表格的行数
for(var i=0;i<rows.length;i++){ //遍历表格的行
for(var j=0;j<rows[i].cells.length;j++){ //遍历每行的列
console.log("第"+(i+1)+"行，第"+(j+1)+"列的值是:"+rows[i].cells[j].innerHTML);
}
}
}
load();//函数调用
</script>
</body>
</html>
最新文章
- 【疑难杂症系列01】TypeError: alert is not a function
- Java程序员从笨鸟到菜鸟之（一百零一）sql注入攻击详解（二）sql注入过程详解
- Java简单类（部门、领导、雇员关系）
- 初识Memcached
- 使用SQL Server维护计划实现数据库定时自动备份
- 转：Struts标签checkbox使用总结(默认选择设置)
- 导入和导出表空间：复制文件比mysqldump&restore快
- Sublime Text 2 快捷键大全
- 修改UI中的值，无反应解决办法
- java中时间格式yyyyMMddHHmmss的大小写问题
- js blog
- 本地存储 web storage
- 如何解决使用Gradle时出现的jar包冲突
- 树状数组 || JZOI 1024. @szefany 的树
- springboot返回页面
- 从servlet规范说起
- element-ui 源码解析 一
- web中绝对路径换虚拟路径
- 在CI (Jenkins) 从机(服务器)上使用bat批处理执行自动构建任务时，输出NuGet还原失败的解决方案
- 计算机网络关于IP地址的计算问题