2015-10-07 jQuery2

 2023-09-11 阅读 24 评论 0

摘要:jQuery (2) 四.过滤选择器 jquery UI, 1. $("input[type='button']").val(“中国”) //所有设置type=button的input,其value设为中国。 简写==>$(":button").val("中国") 列表: $(&#

jQuery (2)

 

四. 过滤选择器

 

jquery UI,   1.  $("input[type='button']").val(“中国”)   //所有设置type=button的input,其value设为中国。

        简写==>$(":button").val("中国")

列表:

$(":button")                                 所有按钮
$(":checkbox")所有复选框,<==>$(“input[type=’checkbox’]”)
$("div:contains(foo)"所有div中包含了文本“foo”的元素
$(“:disabled”)所有被禁用的元素<==>$("input[disabled=disabled]").attr("value", "aaa");)
$(“:enable”)所有没有被禁用的元素
$(“:file”)所有上传文件
$(“:input”)所有表单元素
$(“:selected”)所有下拉菜单中被选中的项
$(“:visible”)所有可见的元素
$(“:submit”)所有提交按钮

js onchange? 

 

 

vs2015, 

 

 

jquery innerhtml、 

 

 

 

 

 

 

 

 

五. 反向过滤

 

     $("input:not(:text)").val("中国")   // 表示所有input中不是文本框的,给它一个value值=”中国“。

     <==>$("input").not(":text").val("中国")

 

     注意: p :not(p:hidden) 错误

 

                p:not(:hidden) 正确   //not后是针对前面的结果集,即not中不能有其它标签

 

六.管理选择结果

   1.获取元素的个数

     $("img").size()      //获取所有页面中img的个数

   2. 提取元素

     $("img[title]")[1]  获取所有设置了title属性的img标记中的第二个元素。

    <==>$("img[title]").eq(1)

   3.获取索引

    alert($("div").index($("div[title='你好']")).eq(1));   //设置了“title=你好”的第二个div,在整个div的索引

    获取当前对象的索引-----$(this).index();

    获取当前对象的内容-----$(this).text();

   4. 添加、删除、过滤元素

   $("img[alt], img[title]").addClass("myClass")    //所有设置了alt属性的img标记和所有设置了title属性的img标记   添加样式。

   $("img").eq(3).removeClass("myClass")           //将第四个img移除myclass样式

   $("li[title]").not("[title*=isaac]") 所有设置了title属性的li标记,但不包括title值中包含isaac的li。

   注意:not()中只能是通用的表达式

            错误:$("li[title]").not("img[title*=isaac]")

            正确: $("li[title]").not("[title*=isaac]")

  5.筛选元素

   $("li").filter("[title*=isaac]" ) <=> $("li[title*=isaac]")      //筛选出title属性中包含isaac的li标签

    注意:filter中的参数,不能直接是等于匹配,只能是前匹配^=,后匹配&=,任意匹配*=。

              filter(函数) 函数要求返回布尔值,对于返回值为true的元素保留,否则去除。

   6.find查找搜索

     $("p").find("span")         //在所有的p标签中搜索span标签

   7.is返回bool

      var bHasImge=$("div").is("img")    //页面中所有的div中是否包含img标签,是返回true,否返回false。

七. jQuery链

   1.jQuery语句链接在一起

     $("div").addClass("myClass1").filter(function(index){return index==1||$(this).attr("id")=="fourth"}).addClass("myClass2");   //attr:设置属性值

       //给所有的div加myClass1样式,然筛选出index=1或当前对象的id=fourth的div添加myClass2样式。

    2.end表示操作对象为当前对象的上一级

     $("p").find("span").addClass("myClass1").end().addClass("myClass2")   //给p标签里的span加上myClass1样式,给p标签加上myClass2样式

     $("p").find("span").addClass("myClass1").addClass("myClass2")            //给p标签里的span加上myClass1样式和myClass2样式

    3.andSelf()表示操作对象为当前对象和其上一级

   $("div").find("p").addClass("myClass1").andSelf().addClass("myClass2")  //给div里面的p加上myClass1样式,给div和div里面的p加上myClass2样式

八. 标记的属性

   1.each()遍历元素

   $(function(){

        $("div").each(function(index){

                   var i=index+1;

                   $(this).attr("title","我是第"+i+"个div")

                     });

  });

   2. 获取属性的值

        var sTitle=$("em:eq(1)").attr("title");                             //获取第二个em的title属性

        $("a[href^=http://]").attr("target","_blank");                // 对于属性href以http://开头的a标签,设置属性值target:_blank

        $("img").attr({src:"aaa.jpg",title:"阮某",alt:"无法显示"}); //设置多个属性值

        $("div").eq(3).removeAttr(“disabled”);                      //对第四个div删除属性值disabled

      注:<em>标签表示强调,对于浏览器,表示将这段文字以斜体来显示

另:

      $("div").eq(3).css("color","red");

      $("div").eq(3).addClass("d4");

      #d4{

             color:#fff;

        }               //结果显示第四个div的字体还是红色,因为设置的css相等于在html中设置了内敛样式,其优先级>id>class.

     同时也可以设置多个css(加上中括号):     $("div").eq(0).css({"color":"black","font-size":"60px","height":"100px"});        

转载于:https://www.cnblogs.com/71yishen/p/4864265.html

版权声明:本站所有资料均为网友推荐收集整理而来,仅供学习和研究交流使用。

原文链接:https://hbdhgg.com/3/45725.html

下一篇:回到顶端

发表评论:

本站为非赢利网站,部分文章来源或改编自互联网及其他公众平台,主要目的在于分享信息,版权归原作者所有,内容仅供读者参考,如有侵权请联系我们删除!

Copyright © 2022 匯編語言學習筆記 Inc. 保留所有权利。

底部版权信息