`
ronon
  • 浏览: 192284 次
  • 性别: Icon_minigender_2
  • 来自: 武汉
社区版块
存档分类
最新评论

JQuery 一些特殊符号的使用

 
阅读更多

前言:我写博客的频率与我的清闲程度成正比。。

 

太闲了所以想记录一下JQuery里的特殊符号,级别:入门级。用到哪里写到哪里,不全面是肯定的。

其实只要接触前端就肯定少不了用jquery,但是以前太忙,都是边学边用,

所谓学,就是看别人的代码怎么写,自己怎么写。所以用来用去就是 val()、show()、hide() 仅此而已。

从来没有系统学过,以至于面试的时候一问三不知。

 

 

在这之前,先说一下如果什么特殊符号都不用,就表示是Dom元素名

例如$("div")表示获取页面中所有的div元素(集合),$("ul")表示获取页面中所有的ul元素(集合)。

 

第一个特殊符号:    #

井号的目标很明确,只和 id名一起用,比如 $("#div1")之类的,div1为样式名,由于id名的唯一性,只会获取一个元素。

 

第二个特殊符号:      .

点如果单独放在某个单词前面,就表示是样式名为xxx的元素(集合),比如$(".redStyle")之类的,

redStyle为样式名。

 

第三个特殊符号:     :

用法1:放在元素名前面,表示某一类元素。

例如:

$(":input")表示选择所有表单元素,例如input,select,textarea,button等元素。

 而$("input") 则只表示所有的 input元素,显然带冒号比不带冒号选择的范围更广。

 分在这一类是为了方便记忆,其实这里的input已经不再表示一个“名词“,而是一个”形容词“。

 也就是用法2中的筛选条件。

 

用法2:放在筛选条件前面,起到过滤作用

例如:

$(":hidden") 表示所有隐藏元素

 

第四个特殊符号:     [  ]

用法1:根据 属性=属性值 来筛选元素时使用

              例如:  $("li[title='蔬菜']") 表示所有title的值为“蔬菜”的li元素

 

第五个特殊符号:   空格

就目前学到的看来,空格一般是用于元素与元素之间。

 

例子如下→

用法1:用于子孙选择器

例如$("div span")表示获取div下的所有span元素集合(包括所有级层)

 

用法2:获取表单中的某一类元素的集合

例如 $("#formTest :checkbox") 表示获取id名为formTest的表单下的所有复选框,

注意,#formTest  与  :checkbox之间的空格不能少。

 

用法3:获取表单中具有相同状态的元素集合

例如 $("#formTest :checked") 表示获取id名为formTest的 表单下所有处于选中状态

的元素,比如单选框、复选框等拥有checked属性的元素。

类似的还有$("#formTest :selected")主要用于下拉框的option属性。

注意,#formTest  与  :checked之间的空格不能少。

 

第六个特殊符号:  

 

其他特殊符号:   >   +    ~

这几个用途比较少,放在一起说

$("div>span") 表示只选取div下第一层级的span元素集合

$("div+span") 表示选取与div在同一层级中的下一个span元素,注意,只返回一个元素

$("div~span") 表示选取与div在同一层级中的后面全部的span元素集合,注意只是同一级层中

分享到:
评论

相关推荐

    jQuery特殊符号转义的实现

    我们在使用jquery选择器的时候 对一些ID属性中有特殊符号的地方需要进行转义。 列举部分如下: <input id="entity.username" type="text" value="hello" /> alert($("#entity\\.username").val()); &...

    jQuery选择器中的特殊符号处理方法

    一般情况下,在jQuery选择器中,我们很少会用到诸如“.”、“#”、“(”、“[”等特殊字符,因为根据W3C规定,HTML文档中属性的值是不能包含有这些个特殊字符的,但是在实际应用中,偶尔也会遇到表达式中含有“#”和...

    使用Jquery获取带特殊符号的ID 标签的方法

    如果你使用JQuery的$(selector)来获取元素,其中selector就是对应的选择器字符串,JQuery会自动处理特殊符号,从而准确地定位到含有特殊符号的ID的标签。 接下来,我们来看一个具体的例子。假设我们有一个HTML元素...

    表单的验证数字字符特殊符号

    表单验证数字字符特殊符号是前端开发中的基本技能,通过合理的验证规则和有效的工具,如jQuery.alphanumeric插件,可以提高表单数据的质量,增强网站的安全性,提升用户的使用体验。开发者应根据实际需求灵活运用...

    初始jQuery

    - **$ 符号**:jQuery的核心符号,代表jQuery函数库本身。 - **连缀操作**:允许连续调用多个方法,从而减少代码量,提高可读性和维护性。例如: ```javascript $("#myElement").hide().fadeIn(); ``` #### 二...

    jQuery中 $ 符号的冲突问题及解决方案

    在JavaScript和jQuery的世界中,`$`符号是一个非常特殊的字符,它被广泛用作jQuery库的别名,方便开发者编写简洁、高效的代码。然而,当一个页面中同时引用了多个版本的jQuery或者其他使用了`$`作为主要函数的...

    jQuery权威指南-源代码

    10.2.1 选择器中含有特殊符号/317 10.2.2 选择器中含有空格符号/318 10.3 优化事件中的冒泡现象/319 10.4 使用data()方法缓存数据/321 10.5 解决jQuery库与其他库的冲突/326 10.5.1 jQuery在其他库前导入/326 ...

    jquery知识点整理

    * $符号:是jQuery的特殊字符,用于声明jQuery对象,同时也是jQuery选取元素的符号 选取元素 * `$("div")`:选取所有的div元素 * `$("#body")`:选取id为body的元素 * `$("div#body")`:选取id为body的div元素 * `...

    jQuery设计思想完整篇

    在jQuery中,开发者使用美元符号$()函数(通常简写为$)作为构造函数,传入一个选择表达式,便能够选中特定的DOM元素或元素集合。例如,使用$('#id')可以选中ID为id的元素,而$('a:first')则选中页面中的第一个元素...

    jquery.js下载

    引入jQuery后,可以使用 `$` 符号来开始编写jQuery代码。例如,获取页面中的元素: ```javascript $(document).ready(function() { // 页面加载完成后执行的代码 $('selector').function(); }); ``` 这里的`...

    JQuery.param

    在实际项目中,如果你遇到对原版jQuery的功能有特殊需求的情况,可以考虑使用这个文件来替换或补充原有的`jQuery.param`功能。 总之,`jQuery.param`是jQuery库中的一个核心工具,它使得在JavaScript中处理和传递...

    jQuery参考手册(1.11.3).rar

    jQuery还提供了一些特殊的事件,如".load()"用于监听元素的加载事件。 jQuery的动画功能非常强大,".animate()"方法允许我们创建自定义的平滑动画效果,包括改变CSS属性如宽度、高度、透明度等。此外,还有预定义的...

    jQuery甘特图例子

    3. **里程碑**:重要的时间点,用以标记项目中的关键事件,通常用特殊符号表示。 4. **依赖关系**:任务之间的先后顺序,可以通过线条连接表示,帮助用户理解任务间的逻辑关系。 5. **进度更新**:允许用户实时...

    jQuery用户注册表单验证代码

    在HTML文档中引入jQuery库后,可以通过"$"符号来调用其方法。例如,`$(document).ready()`函数确保在页面加载完成后再执行里面的代码,这样可以避免因DOM未完全加载而引发的问题。 对于用户注册表单,通常包括...

    Facebook表情符号jQuery插件.zip

    插件的设计理念是模仿Facebook社交平台上的表情符号系统,这是一套广泛认可和使用的表情图标,包括喜怒哀乐等各种情绪,以及各种情境下的特殊表情,如爱心、惊讶、点赞等。这些表情符号的引入,使得用户可以通过视觉...

    jQuery Virtual Keyboard

    此外,对于有特殊输入需求的应用,如数字输入、符号输入,也可以定制键盘布局来满足需求。 总结,jQuery Virtual Keyboard是一个强大的工具,它结合了jQuery的便利性和虚拟键盘的实用性,为Web开发者提供了在任何...

    jquery虚拟键盘 jquery.keypad.package-1.2.0

    1. **跨浏览器兼容性**:jQuery Keypad 1.2.0致力于支持所有主流浏览器,包括IE8及以上版本,Firefox,Chrome等,确保了广泛用户群体的使用体验。 2. **自定义配置**:该插件允许开发者通过选项参数来定制键盘布局...

Global site tag (gtag.js) - Google Analytics