zoukankan      html  css  js  c++  java
  • Jquery知识小点:

    一:this与$(this)的区别

    jQuery中this与$(this)的区别

    1. $("#textbox").hover(   
    2.       function() {   
    3.            this.title = "Test";   
    4.       },   
    5.       fucntion() {   
    6.           this.title = "OK”;   
    7.       }   
    8. ); 

    这里的this其实是一个Html 元素(textbox),textbox有text属性,所以这样写是完全没有什么问题的。
    但是如果将this换成$(this)就不是那回事了,Error--报了。this与$(this)的区别在此。

    1. Error Code:   
    2. $("#textbox").hover(   
    3.        function() {   
    4.           $(this).title = "Test";   
    5.        },   
    6.        function() {   
    7.           $(this).title = "OK";   
    8.        }   
    9. ); 
    这里的$(this)是一个JQuery对象,而jQuery对象沒有title 属性,因此这样写是错误的。

    JQuery拥有attr()方法可以get/set DOM对象的属性,所以正确的写法应该是这样:

    1. $("#textbox").hover(   
    2.       function() {   
    3.          $(this).attr(’title’, ‘Test’);   
    4.       },   
    5.       function() {   
    6.          $(this).attr(’title’, ‘OK’);   
    7.       }   
    8. ); 

    使用jQuery的好处是它包裝了各种浏览器版本对DOM对象的操作,因此统一使用$(this)而不再用this应该是比较不错的选择。

     二: 选择器

    JQuery 元素选择器

    jQuery 使用 CSS 选择器来选取 HTML 元素。

    $("p") 选取 <p> 元素。

    $("p.intro") 选取所有 class="intro" 的 <p> 元素。

    $("p#demo") 选取 id="demo" 的第一个 <p> 元素

    JQuery 属性选择器。

    jQuery 使用 XPath 表达式来选择带有给定属性的元素。

    $("[href]") 选取所有带有 href 属性的元素。

    $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

    $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

    $("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

    JQuery css选择器。

    jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

    下面的例子把所有 p 元素的背景颜色更改为红色:

    $("p").css("background-color","red");
     
    更多的选择器
    语法描述
    $(this)当前 HTML 元素
    $("p")所有 <p> 元素
    $("p.intro")所有 class="intro" 的 <p> 元素
    $(".intro")所有 class="intro" 的元素
    $("#intro")id="intro" 的第一个元素
    $("ul li:first")每个 <ul> 的第一个 <li> 元素
    $("[href$='.jpg']")所有带有以 ".jpg" 结尾的属性值的 href 属性
    $("div#intro .head")id="intro" 的 <div> 元素中的所有 class="head" 的元素

     

  • 相关阅读:
    jstack使用教程
    频繁fullgc排查
    ubuntu添加ubuntu make
    Spring属性编辑器详解
    mysql 查看触发器,删除触发器
    mongodb启动不了:提示错误信息为 child process failed, exited with error number 100
    RedHat7 防火墙设置以及端口设置
    linux 设置静态IP方法
    linux 安装mongo
    mongo 介绍
  • 原文地址:https://www.cnblogs.com/daohuen/p/2306050.html
Copyright © 2011-2022 走看看