1、jquery_属性和选择器

1、ID选择器

2、attr和val和removeattr

3、attr和removeattr和val

<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="scripts/jquery-1.7.1.min.js"></script>
    <script>
        //$(function () {}）代表页面加载完成
        $(function () {
            //$('#bt1') 代表获取ID，也就是id选择器
            $('#bt1').click(function () {
                //val（）获取value值，val(str) 给value赋值
                $('#bt1').val('显示');
            });
            $('#bt2').click(function () {
                //attr（name）表示添加name属性，attr（name，value）表示添加name属性，且赋值value
                $('#bt2').attr('value','attr显示')
            });
            //removeAttr(name)代表删除属性name
            $('#bt3').click(function () {
                $('#bt3').removeAttr('value');
            });
        })
        
    </script>
</head>
<body>
    <input type="button" id="bt1" />
    <input type="button" id="bt2" />
    <input type="button" id="bt3" value="bt3"/>
    <script>

    </script>
</body>
</html>

4、元素选择器：标签

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="scripts/jquery-1.7.1.min.js"></script>
    <script>
        $(function () {
            $('input').click(function () {
                //注意这样就拿到了所有的input标签，而我们是需要只拿点击的对象所以用Dom对象
                //$('input').val("呜呜")
                this.value = '呜呜';
            })
        })
    </script>
</head>
<body>
    <input type="button" value="笑笑" />
    <input type="button" value="笑笑" />
    <input type="button" value="笑笑" />
    <input type="button" value="笑笑" />
    <input type="button" value="笑笑" />
    <input type="button" value="笑笑" />
</body>
</html>

5、类选择器：.class

6、

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="scripts/jquery-1.7.1.min.js"></script>
    <script>
        $(function () {
            $('#Button1').one('click', function () {
                //对于标签对，使用text（），html（）进行设置和获取
                $('#txt1').text('这是个div')
            });
        })
    </script>
</head>
<body>
    <input id="Button1" type="button" value="button" />
    <div id="txt1"></div>
</body>
</html>

 

posted @ 2019-06-17 23:14  风情单车  阅读(195)  评论(0)  编辑  收藏  举报