• jQuery


    1、id 选择器

    2、标签选择器

    3、类选择器

    4、复合选择器

    5.层次选择器

    JQuery的迭代

     

    JQuery选择器


    JQuery选择器用于查找满足条件的元素,比如可以用$(“#控件Id”)来根据控件id获得控件的jQuery对象,相当于getElementById:
    1、id 选择器   $(“#div1”).html(“<font color=red>hello</font>”)。语法、意义类似于CSS选择器

    显示行号 复制代码 这是一段程序代码。
    1. <!DOCTYPE html>
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <head>
    4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5.     <title></title>
    6.     <script src="Jqeury/jquery-1.10.2.js" type="text/javascript"></script>
    7.     <script type="text/javascript">
    8.         $(function () {
    9.             //显示1个:我是d1
    10.             $("#d1").text("我是d1");
    11.             //显示2个:我的类选择器Div2
    12.             $(".Div2").text("我的类选择器Div2");
    13.             //显示5个,并把前面的覆盖了
    14.             $("div").text("都是我div的");
    15.         })
    16.     </script>
    17. </head>
    18. <body>
    19.     <div id="d1"></div>
    20.     <div id="Div1"></div>
    21.     <div class="Div2"></div>
    22.     <div id="Div3"></div>
    23.     <div class="Div2"></div>
    24. </body>
    25. </html>


    2、标签选择器 $("TagName")来获取所有指定标签名的jQuery对象,相
           当于getElementsByTagName:
            $(function() {
                $("#btnClick").click(function() {
                    $("p").html("我们都是P");
                });
            });
    3、类选择器
    JQuery中注册事件监听的写法:click()、leave()、focus()、blur...,自己动手写click函数。
    规则: $(who).when({what});      例: $(‘#a’).click(function(){});

     

    4、复合选择器:$("p,div,span.menuitem"),同时选择p标签、div标签和拥有menuitem样式的span标签元素(类似于CSS选择器)

    image

     

    5.层次选择器:
    (1)$("div p")获取div下的所有p元素(后代,子、子的子……)
    (2)$("div > p")获取div下的直接p子元素
    (3)$(".menuitem + div")获取样式名为menuitem之后的第一个div元素(不常用
    (4)$(".menuitem ~ div")获取样式名为menuitem之后所有的div元素(不常用

    jQuery修改样式:$("#div1").css("background", "red");
    获得样式$(“#div1”).css(“background”);
    修改value:$(“#un”).val(“abc”),
    获得value:$(“#un”).val()

    $(function() {
                $("#wrap p").css("background-color","red");
            })

    类似的获得、设置innerText、innerHTML用text()和html()。val、html、text等是方法,不是属性,jQuery中很少有属性的用法,因为属性写法很难“链式编程”。

    JQuery的迭代


    如何判断对象是否存在,jQuery选择器返回的是一个对象数组(数组中的每个对象还是Dom对象),调用text()、html()、click()之类方法的时候其实是对数组中每个元素迭代调用每个方法,因此即使通过id选择的元素不存在也不会报错,如果需要判断指定的id是否存在,应该写:

    if ($("#btn1").length <= 0) {
                    alert("id为btn1的元素不存在!");
                }
  • 相关阅读:
    开启linux服务器防火墙
    Linux系统编程11_管道和命名管道
    Lua语法
    Git学习
    Buildroot介绍
    Makefile基本介绍
    页、页表和块
    文件系统,根文件系统,MTD
    什么是ioctl
    bootargs的mtdparts解析
  • 原文地址:https://www.cnblogs.com/tangge/p/3178209.html
Copyright © 2020-2023  润新知