`
lizaochengwen
  • 浏览: 662614 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery特殊符号含意

 
阅读更多

jquery写作方式:

               //完整的写法
    jQuery(document).ready(function() { alert("Hello"); });


    //jQuery 可简写为 $
    $(document).ready(function() { alert("Hello"); });


    //$(document) 可以简写为 $()
    $().ready(function() { alert("Hello"); });


    //$(document).ready() 也可以简写为 $()
    $(function() { alert("Hello"); });


window.onload与$(function(){})区别

window.onload() 发生在页面载入完成时,

$(document).ready() 发生在页面主体框架载入完成时(或许某个图片还没下载完);


基本选择
代码:

<div id="div1">AAA</div>
<div class="class1">BBB</div>
<span id="div3">CCC</span>

<div class="class2"><span>222</span></div>

<div class='class3'><span id='span2'>hello world</span></div>

<div class='class3'><label id='span2'>label</label></div>


根据 id 选择$("#div1")

根据class选择$(".class1")

根据标签名选择$('span')

选择所有的对象$("*")

混合选择$("#div1,.class1,span")

分层选择$(".class2 span")或者$(".class2").find('span')

只从子层中选择    $(".class2>span")

选择所有紧跟在 div 后面的 span     $(".class2+span")

选择 #id2 后面同一层级的所有(*)对象    $("#id2~*").

混合使用 $(".class3 label,.class2>span")

选择同一层级的其他元素$("#div1").siblings();

选择同一层级的其他 span $("#div1").siblings('span');


特殊字符含义

#  指示 id 

.  指示 class 
*  全选 
,  多选 
空格 后代 
>  子 
~  兄弟 
+  下一个 
:  子(多功能) 

()  函数式的过滤与查找

选取子对象

代码

定位子对象

<h3>AAA</h3>

<ul> 

               <li>我那年深月久的苦乐年华</li>

    <li> “90后”应该补的课究竟有哪些?</li>

    <li>北京下的不是雪,而是“珍珠米</li>

             <li>一句“没想过”让我走出迷雾</li>

</ul>

<ul>

    <li> 麻辣生活,自信勇敢会是最给力!</li>

</ul>

<ul>

    <li>上海给力N日游之奢华恒隆是这样</li>

    <li>从这个世界走来一个小小的我--蝉想</li>

    <li>恋爱是不是一场明码交易?</li>

</ul> 

获取所有标题对象  $(":header")

获取 first   $("li:first")或$("li").first()或$("li").get(0)

获取每组的 first  $("li:first-child")或$("ul li:first-child")

获取 last  $("li:last")或$("li").last()

获取每组的 last $("li:last-child")或$("ul li:last-child")

获取第几个 $("li:eq(2)")或$("li").eq(2)  //eq 是 0 开始

获取第几个之后的 $("li:gt(2)") //gt是0开始

获取第几个之前的$("li:lt(2)")//lt是0开始

获取索引数是偶数的 $("li:even")//even是0开始

获取索引数是奇数的$("li:odd")//odd是0开始

获取每小组第偶数个$("li:nth-child(even)")//nth-child是1开始

获取每小组第奇数个$("li:nth-child(odd)")//nth-child是1开始

获取每小组第几个:$("li:nth-child(2)")//nth-child是1开始的

表达式获取第几个$("li:nth-child(3n-1)")//n是从1开始的

如果是父元素中唯一的子元素 $("li:only-child")

not是取其反  $("li:not(li:only-child)")

根据属性来选择

代码

 

<div id="names">names</div>

<div id="hello"  name='ss'>hello</div>

<div id="spans"  name='spanname'><span>中国人</span></div>

<div id="worlds">worlds</div>

<div id="empty"></div>

指定元素包含id的$("div[id]")

指定元素中不包含id的$("div:not([id])")

名称为ss的元素 $("div[name='ss']")

名称不为ss的元素$("div[name!='ss']")

元素符合以world开始的$("div[id^='world']")

以o结束的$("div[id$='o']")

id 中包含ll的$("div[id*='ll']")

多个条件的,有id属性并且name中包含d的$("div[id][name*='d']")

查找内容中包括world的$("div:contains('world')")

查找包括span 的$("div:has('span')")

查找空的div     $("div:empty")

查找父元素$("div:parent")

hidden和visible分别对应隐藏和显示的元素

$("div:hidden")//获取隐藏的元素

$("div:visible")//获取显示的元素

表单元素的获取

:input匹配  <input />      <select></select>    <textarea></textarea>   <button />

:text匹配<input type='text' />

:password匹配<input type='password' />

:radio 匹配<input type='radio' />

:checkbox 匹配<input type='checkbox' />

:submit 匹配<input type='submit' />

:button 匹配<input type='button' /> <button />

:reset 匹配<input type='reset' />

:image 匹配<input type='image' />

:file 匹配<input type='file' />

:enabled匹配所有可用的input

:disabled匹配所有不可用的input

:checked 匹配所有选中的单选复选按钮

:selected 匹配所有选中的option

以上的内容 是根据 http://tech.ddvip.com/2010-06/1276246634155161_4.html进行整理修改的

分享到:
评论

相关推荐

    jQuery特殊符号转义的实现

    总结而言,特殊符号转义是Web前端开发中一项十分实用的技术,它确保了开发者在使用jQuery时能够更加灵活地处理和操作包含特殊字符的ID或类名的DOM元素。掌握这些转义规则,对于编写健壮的前端代码十分重要。

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

    如果ID中包含的特殊符号是在CSS选择器中有特殊含义的字符,例如冒号(:)、空格( )、&gt;、+、~、|,在JQuery中应该用双反斜杠(\\)进行转义,或者使用双引号把整个ID包起来。例如,如果ID是“my:tag:name”,则在...

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

    然而,当选择器表达式中包含了一些特殊字符,如"."(类选择器)、"#"(ID选择器)、"("、"["(属性选择器)等,它们可能会引起解析问题,因为这些字符在CSS中具有特殊的含义。在实际应用中,我们可能会遇到需要在ID...

    JQuery对id中含有特殊字符的转义处理示例

    然而,当ID包含特殊字符时,如在给定的标题和描述中提到的`/@`或`[]`,这可能会导致选择器失效,因为这些字符在CSS和jQuery选择器中有特殊的含义。为了正确地选择这些ID,我们需要进行转义处理。以下将详细解释如何...

    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插件,是文本框只能输入数字

    这可能包括添加千位分隔符、货币符号或其他特定格式,使得输入的数字更加易读和符合业务需求。例如,用户输入1234567,插件可能将其自动转换为"1,234,567"或者"$1,234,567"。 标签"jquery插件"和"文本框只能输入...

    jQuery选择id属性带有点符号元素的方法

    在使用jQuery选择器时,开发者常常需要处理带有特殊字符的id属性,如点符号(.)。在JavaScript中,点符号(.)是一个特殊字符,用于访问对象的属性。因此,当id属性中包含点符号时,会与jQuery的类选择器(class ...

    jQuery实现的可直接添加删除表单元素特效源码.zip

    引入后,可以通过`$`符号或`jQuery`对象来调用其提供的方法。例如: ```html &lt;script src="path/to/jquery.min.js"&gt; ``` 二、jQuery选择器 jQuery选择器用于选取HTML元素,它们基于CSS选择器进行扩展。例如,`$("#...

    jQuery中(function($){})(jQuery)详解

    在jQuery的代码中,我们经常看到一种特殊的语法结构 `(function($){})(jQuery)`,这被称为立即执行函数表达式(IIFE,Immediately Invoked Function Expression)。这个结构在jQuery插件开发中尤为常见,因为它提供...

    JS 过滤特殊字符

    1. JavaScript库:jQuery、Lodash等库提供了字符串处理函数,例如`$.trim()`、`_.escape()`,可以辅助进行特殊字符过滤。 2. 在线工具:在线的JavaScript格式化、编码解码工具(如:jsbeautifier.org)也能帮助...

    浅谈jquery的html方法里包含特殊字符的处理

    在HTML中,某些字符有特殊的含义,比如`用于开始标签,`&gt;`用于结束标签,`"`和`'`用于定义属性值的边界。如果直接在HTML中使用这些字符,浏览器会尝试解析它们为HTML语法,而不是作为文本内容。例如,`&lt;script&gt;`标签...

    jquery与ajax获取特殊字符实例详解

    特殊字符如"&"、"+"等在URL编码中具有特殊含义,不正确地处理它们可能会导致数据解析错误或者请求失败。本篇文章将深入探讨如何在jQuery与Ajax中正确地处理包含特殊字符的数据。 首先,我们需要理解为什么特殊字符...

    简述Jquery与DOM对象

    在实际编码过程中,为了提高代码的可读性和易维护性,我们可以约定一些编码规范,比如用$前缀来标识JQuery对象,而普通的DOM对象则不添加任何特殊符号。这样的约定可以让阅读代码的人更快地识别出对象的类型,从而...

    浅谈jQuery中replace()方法

    总结来说,jQuery中的replace()方法是一个功能强大的字符串处理工具,可以处理字符串中复杂的替换逻辑,理解其工作机制和参数用法对于提高前端开发效率和代码质量具有重要意义。对于初学者来说,通过实际编码实例来...

    jQuery正则表达式的使用方法步骤详解

    - 确保理解正则表达式的特殊字符和元字符,比如`^`、`$`、`*`、`+`等的含义。 - 正则表达式对性能有一定影响,特别是在处理大量文本时。合理优化正则表达式,避免过于复杂的规则,可以提升性能。 - 对于跨浏览器兼容...

    Ajax传递特殊字符的数据如何解决

    在网络通信中,特殊字符通常指的是那些在网络协议中有特殊含义的字符,例如:`&`、`+`、`%`、`?`、`"`、`、`&gt;`、`#`、空格等。当这些字符出现在数据中时,如果不对它们进行适当处理,就可能导致数据在传递过程中被...

    jQuery中$this和$(this)的区别介绍(一看就懂)

    首先,我们需要明确this关键字在JavaScript和jQuery中的含义。在JavaScript中,this关键字指的是当前函数的上下文对象。在jQuery的回调函数中,比如事件处理函数,this通常指向触发事件的DOM元素。而在jQuery中,$...

Global site tag (gtag.js) - Google Analytics