属性过滤器

属性过滤器

在昨天由老师带领我们统一回顾了一下属性过滤器,个人感觉像这种过滤器选择器之类的并不算太难,只要自己认真一点基本不会有什么错误,所以最主要的还是细心,不马虎。

属性过滤器jquery内容:

$(function () {
            //$("a[id!='a1']").css("color","red")
            $("textarea").css("overflow-x", "auto");
            $("#name").attr("value", "张三");
            alert($(":input").length);
            alert($(":image").length);
            });

属性过滤器boby内容:

<div style="height:1000px" >
        <a id="a1" href="#">链接1</a>
        <a id="a2" href="#">链接2</a>
        <a id="a1" href="#">链接1</a>
    </div>-->

然后在这个之后又重新回顾了表单选择器,又相对做了一部分联系:

<script type="text/javascript">
        $(function () {
            //$("a[id!='a1']").css("color","red")
            $("textarea").css("overflow-x", "auto");
            $("#name").attr("value", "张三");
            alert($(":input").length);
            alert($(":image").length);
            $("#tj").click(function () {
                var name = $(":text").val();
                console.log(name);
                //单选框
                var sex = $(":radio:checked").val();
                console.log(sex);
                //复选框
                var hot = "";
                $(":checkbox:checked").each(function () {
                    hot += $(this).val() + "、";
                })
                console.log(hot);
                //下拉列表
                var drop = $("#Select1 :selected").val();
                console.log(drop);
                return false;
            })
        })

<table>
        <tr>
            <td>姓名:</td>
            <td><input type="text" id="name" /></td>
        </tr>
        <tr>
            <td>性别:</td>
            <td>
                <input type="radio" name="sex" id="sex1" value="男" checked="checked" />
                <label for="sex1">男</label>
                <input type="radio" name="sex" id="sex1" value="女" />
                <label for="sex1">女</label>
            </td>
        </tr>
        <tr>
            <td>爱好:</td>
            <td>
                <input type="checkbox" id="aihao"  value="足球"/>足球
                <input type="checkbox" id="aihao" value="篮球" />篮球
                <input type="checkbox" id="aihao"   value="羽毛球"/>羽毛球
            </td>
        </tr>
        <tr>
            <td>籍贯:</td>
            <td>
                <select id="Select1">
                    <option value="--请选择--">--请选择--</option>
                    <option>郑州</option>
                    <option>洛阳</option>
                    <option>开封</option>
                    <option>濮阳</option>
                    <option>南阳</option>
                    <option>安阳</option>
                    <option>信阳</option>
                </select>
            </td>
        </tr>
        <tr>
            <td>简介:</td>
            <td>
                <textarea name="" rows="10" cols="25">
                    
                </textarea>
            </td>
        </tr>
        <tr>
            <td></td>
            <td colspan="2">
                <input type="button" value="重置" id="cz"/>
                <input type="button" value="提交" id="tj" />
            </td>
        </tr>
    </table>

输入的数据输出效果如下:

在这里插入图片描述
在这里插入图片描述

©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页