zoukankan      html  css  js  c++  java
  • 获取html中某些标签的值

    一、获取单选按钮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 {
                 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>
    
  • 相关阅读:
    去除 SQL Server 查询结果中的两边空格
    Ubuntu 中安装 Oracle 10g
    不同格式的下拉列表框
    闲来无趣,写了个简单的JavaScript验证码
    Ubuntu 任务前后台调度管理
    C#数据类型转换,Convert
    OleDbType,C#,access 对应数据类型,互相对应
    SQL 将查询出的表当做 value 插入到表中
    asp.net mvc && asp.net 页面跳转
    asp.net mvc 与 asp.net结合(asp.net mvc 技巧)
  • 原文地址:https://www.cnblogs.com/smalldong/p/13889774.html
Copyright © 2011-2022 走看看