返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JQuery中$之选择器用法介绍
  • 215
分享到

JQuery中$之选择器用法介绍

JQuery$选择器 2022-11-21 22:11:31 215人浏览 安东尼
摘要

1.$。在Jquery 中$("<span>"),这个语法等同于$(document.createElement("span")) ,这是一种用法,在选择元素的时候还会这

1.$。在Jquery 中$("<span>"),这个语法等同于$(document.createElement("span")) ,这是一种用法,在选择元素的时候还会这样子的用:[attribute$=value],匹配给定的属性是以某些值结尾的元素。下面举个例子来说明一下:
html代码
<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />
jQuery 代码:
$("input[name$='letter']")
结果:
[ <input name="newsletter" />, <input name="jobletter" /> ]
2.!。选择器:[attribute!=value],匹配所有不含有指定的属性,或者属性不等于特定值的元素,此选择器等价于:not([attr=value])。
例子说明一下:
HTML代码
<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代码:
$("input[name!='newsletter']").attr("checked", true);
结果:
[ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ]
3.*。选择器:[attribute*=value],匹配给定的属性是以包含某些值的元素。举个例子说明一下:
HTML 代码:
<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />
jQuery 代码:
$("input[name*='man']")
结果:
[ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ]
4.@。匹配包含给定属性的元素。注意,在jQuery 1.3中,前导的@符号已经被废除!如果想要兼容最新版本,只需要简单去掉@符号即
可。
5.^。选择器:[attribute^=value],匹配给定的属性是以某些值开始的元素,下面举个例子来说明一下:
HTML 代码:
<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />
jQuery 代码:
$("input[name^='news']")
结果:
[ <input name="newsletter" />, <input name="newsboy" /> ]

在jquery中,当使用$("input[name='metaid']“).val()不能直接获得被选择的radio的值,只是获得 radio标签的第一个值,这可能jquery使用xpath语言了进行查找有关,而我们通常是想获得被选中的radio的值,有以下几种方法:
1,使用$("input[name='metaId']:checked").val()获得 //name代表radio中name属性名
2,使用$(":radio:checked").val()获得 //限制页面只有一组radio标签

--结束END--

本文标题: JQuery中$之选择器用法介绍

本文链接: https://lsjlt.com/news/173212.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • JQuery中$之选择器用法介绍
    1.$。在jQuery 中$("<span>"),这个语法等同于$(document.createElement("span")) ,这是一种用法,在选择元素的时候还会这...
    99+
    2022-11-21
    JQuery $选择器
  • jQuery选择器用法介绍
    目录一、jQuery选择器二、基本选择器三、层次选择器四、属性选择器五、过滤选择器1、基本过滤选择器2、可见性过滤选择器3、内容过滤器六、表单选择器七、补充1、特殊符号的转义2、选择...
    99+
    2024-04-02
  • CSS中id选择器的用法介绍
    本篇内容介绍了“CSS中id选择器的用法介绍”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!id选择器id选...
    99+
    2024-04-02
  • CSS类选择器的用法介绍
    这篇文章主要讲解了“CSS类选择器的用法介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS类选择器的用法介绍”吧!CSS类选择器在CSS中,CSS类选...
    99+
    2024-04-02
  • CSS3选择器的使用方法介绍
    这篇文章主要讲解了“CSS3选择器的使用方法介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS3选择器的使用方法介绍”吧!一 通用选择器1 ...
    99+
    2024-04-02
  • css后代选择器的用法介绍
    这篇文章主要讲解了“css后代选择器的用法介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“css后代选择器的用法介绍”吧!说明后代选择器必须用空格隔开。后代不仅仅是儿子, 也包括孙子/重孙...
    99+
    2023-06-20
  • css串联选择器和后代选择器的用法介绍
    本篇内容介绍了“css串联选择器和后代选择器的用法介绍”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!串联选...
    99+
    2024-04-02
  • CSS的子元素选择器用法介绍
    本篇内容介绍了“CSS的子元素选择器用法介绍”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!基础 子元素选择...
    99+
    2024-04-02
  • jQuery之$(document).ready()使用介绍
    $(document).ready()是一个jQuery的方法,用于在DOM加载完成后执行指定的代码。它的作用是确保在页面元素完全加载后再执行jQuery代码,以避免在DOM还未完全加载时执行代码导致的错误。使用$(document)....
    99+
    2023-08-09
    jQuery
  • CSS中子元素选择器的使用介绍
    这篇文章主要讲解了“CSS中子元素选择器的使用介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS中子元素选择器的使用介绍”吧!与后代选择器相比,子元素...
    99+
    2024-04-02
  • CSS中的伪选择器详细介绍
    本篇内容主要讲解“CSS中的伪选择器详细介绍”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“CSS中的伪选择器详细介绍”吧!说到伪选择器,真的让我体会到了CSS的...
    99+
    2024-04-02
  • jQuery 编程之jQuery 属性选择器
    目录一、属性选择器Attribute Selector [name="value"]Attribute Selector [name|="value&q...
    99+
    2022-11-13
    jQuery 编程 jQuery 属性选择器
  • jQuery trigger()方法用法介绍
    jQuery的trigger()方法用于触发指定元素上的特定事件。它模拟了用户对元素的交互操作,例如点击、鼠标悬停等,从而触发相应的事件处理程序。使用trigger()方法可以实现以下几个功能:1. 触发指定元素上的特定事件。例如,可以...
    99+
    2023-08-11
    jQuery
  • JQuery选择器用法详解
    目录一、基本选择器二、层次选择器三、表单选择器四、属性选择器一、基本选择器 id选择器元素名称选择器类选择器选择所有元素组合选择器 <html> <head>...
    99+
    2024-04-02
  • CSS选择器的详细介绍
    这篇文章主要讲解了“CSS选择器的详细介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS选择器的详细介绍”吧!一、什么是选择器选择器是CSS最重要的方...
    99+
    2024-04-02
  • jQuery中toggle和hover的用法介绍
    这篇文章主要介绍“jQuery中toggle和hover的用法介绍”,在日常操作中,相信很多人在jQuery中toggle和hover的用法介绍问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,...
    99+
    2024-04-02
  • jQuery中bind的用法简单介绍
    jQuery中的bind()方法用于将一个处理函数绑定到指定的元素上,该处理函数将在特定事件触发时被调用。bind()方法的基本语法如下:```javascript$(selector).bind(event, data, handle...
    99+
    2023-08-09
    jQuery
  • CSS3中伪类选择器的详细介绍
    这篇文章主要讲解了“CSS3中伪类选择器的详细介绍”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“CSS3中伪类选择器的详细介绍”吧! ...
    99+
    2024-04-02
  • Jquery选择器简明版 Jquery选择器实用版
    根据id名称进行选择: 选择器:$("#id") <div id="id">选中 </div> 根据类名进行选择: 选...
    99+
    2023-05-18
    Jquery选择器
  • CSS中的各种选择符介绍
    本篇内容介绍了“CSS中的各种选择符介绍”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!类型,类和ID选择器...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作