程序员经验分享-hwhale

将 jquery 选择器存储在变量中

2024-01-05

在下面的示例中stored jQuery selector返回错误的值。 是否可以存储选择器而不是结果？

js代码：

// storing the jQuery selectors
var
  $container = $( '.container' ),
  $element1  = $container.find( '.element' ),
  $element2  = $( '.element', $container ),
  $element3  = $( '.element' );

// append elements to the container
for( i=0; i<10; ++i ){
  $container.append( $(element_html) );  
}

// try the stored selectors -> returns 0
console.log( "1: " + $element1.length );
console.log( "2: " + $element2.length );
console.log( "3: " + $element3.length );

为什么如果我使用容器选择器来查找元素，它会起作用？ 这是因为选择器返回pointer到匹配的元素而不是元素？

// this works
console.log( "1: " + $container.find( '.element' ).length );
console.log( "2: " + $( '.element', $container )  .length );
console.log( "3: " + $( '.element' )              .length );

jsFiddle演示 http://jsfiddle.net/SxC3S/


你对什么有根本性的误解

variableName = $("selector here");

做。它不“存储选择器”。它运行您提供的选择器currentDOM 中的元素，创建一个 jQuery 对象，将匹配的元素放入 jQuery 对象中，并为您提供对该 jQuery 对象的引用。不存储选择器（以 jQuery 内部为模）。

所以给出：

<body>
<div class="foo">x</div>
</body>

Then:

var $divs = $("div.foo");
console.log($divs.length);        // 1

给我们这个：

如果我们再添加另一个匹配div:

$('<div class="foo"></div>').appendTo(document.body);

Our $divs仍然只指向第一个；添加另一个匹配元素到 DOM 对引用的 jQuery 对象没有影响$divs.

如果我们此时重新运行查询：

$divs = $("div.foo");

...然后我们有：

如果您有一个包含 DOM 元素的 jQuery 对象，并且您添加后裔元素到该 DOM 元素，然后使用该 jQuery 对象（例如）.find将会见到子孙。这是因为父 DOM 元素已经存在于 jQuery 对象中。例如，添加一个span到其中之一div是我们already来自我们的 jQuery 对象的引用：

如果我们要使用.find on $divs那时正在寻找一个span，我们会找到它，因为它是我们已经引用过的元素之一的后代。

如果你想稍后重新运行 DOM 搜索来查找匹配的元素，你只需使用$()再次;这在上面是隐含的，但为了清楚起见：

var $divs = $("div.foo");
console.log($divs.length);        // 1
$('<div class="foo"></div>').appendTo(document.body);
console.log($divs.length);        // Still 1
$divs = $("div.foo");
console.log($divs.length);        // Now it's 2

因此，在需要时“存储选择器”就是将选择器字符串存储在某处，而不是 jQuery 对象。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

jQuery

html

jqueryselectors

将 jquery 选择器存储在变量中 的相关文章

  • jQuery - 拖动div css背景

    我希望能够在 div 内按住鼠标并移动它的背景 在谷歌上搜索了很多 没有找到我想要的 这是目标 显示的地图是要拖动的对象 http pontografico net pvt gamemap http pontografico net pvt

  • 如何使用javascript隐藏div

    我想使用 Javascript 隐藏一个 div 下面是我的div div class ui dialog titlebar ui widget header ui corner all ui helper clearfix span cl

  • 有一个带有复选框的 jsTree，如何禁用所有复选框？

    我有一个动态构建的 jsTree 它允许用户选择他选择的任何节点 现在我试图使这棵树只读 以便其他用户可以看到信息而不改变它 我找到的所有示例都是关于禁用特定节点 我的问题是 有没有办法将树上的所有复选框定义为只读 正在使用的代码 jQue

  • 设置股票数据 Highcharts xAxis 的格式

    我已经浏览了需要为 xAxis 属性设置的 Highcharts 选项来格式化时间标签 但没有运气了解这对于这种情况到底是如何工作的 我在白天 盘中 检索了股票的动态数据 我需要显示这些数据 因为检索的数据每天从 9 30 开始到 17 0

  • iPad 2 的 HTML5 源元素错误是否已修复？

    根据这个页面 http camendesign com code video for everybody webm http camendesign com code video for everybody webm 第一个 iPad 有一

  • 更改文本框中一个字符的颜色 HTML/CSS [重复]

    这个问题在这里已经有答案了 我正在设计一个网站 我想问一下大家 如何通过CSS改变HTML文本框中字符串中的一个字符的颜色 示例 STACK OVER FLOW 只是 A 字母是红色的 你不能用常规方法做到这一点

  • 以编程方式触发 highchart 散点图上某个点的单击事件

    实际上 我有一个小要求 其中有一个带有点列表和下拉列表的散点图 当我从下拉列表中选择一个项目时 应触发其相应的数据点单击 当我在图表上选择一个数据点时 必须执行一些操作 并且下拉列表应根据选择进行更新 我们有什么办法可以做到这一点吗 我尝试

  • 将数字限制为段的最优雅的方法是什么？

    比方说x a and b是数字 我需要限制x到段的边界 a b 换句话说 我需要一个钳位功能 https math stackexchange com q 1336636 clamp x max a min x b 有人能想出一个更易读的版

  • 您网站上的自定义 jQuery 脚本有多少行代码？多少才算是太多呢？

    对于我们的网站 我使用了大量 jQuery 现在我正在查看基础库顶部的 340 行 jQuery 代码 多少是太多了 我将添加更多内容 我什么时候开始尝试压缩代码并最终转向 OOP 行数并不意味着什么 重要的是你实际上在做什么 您可能拥有

  • 本地 401 工作，临时服务器得到 302

    我可能不会获得帮助第一次尝试所需的所有信息 但我会尽我所能 并在我们进行过程中对其进行编辑 我有一个使用 Spring Security Core 插件的 Grails 1 3 7 应用程序 我正在编写处理会话超时和 ajax 请求的代码

  • Material.Angular.io mat-autocomplete [displayWith] 函数更新范围变量

    我遇到了一个问题 我可以在实例化 mat autocomplete 的组件控制器中访问本地声明的变量 我面临的问题是局部变量被困在这个范围内 我无法更新它们 有关更新 mat autocomplete 范围变量的任何想法或想法 最终我要做的

  • 两个日期之间间隔 15 分钟 javascript

    问题 我需要将两个日期 时间戳之间的所有 15 分钟时隙 日期格式 2016 08 10 16 00 00 创建为 HH mm 格式的数组 其中分钟限制为 00 15 30 45 示例 中午 12 30 到下午 2 30 将 gt 12 3

  • backbone.js：视图中影响集合中不同模型的按钮

    我刚刚开始使用backbone js 到目前为止 我真的很喜欢它 我有这样的事情 ModelA ModelB ViewA ViewB ModelA 持有 ModelB 的集合 如何使用按钮构建模型 B 的视图 单击该按钮会更改集合中下一个

  • iframe 位置居中

    所以我找到了这段用于将内容放在中心的代码 但我的问题是它是为容器制作的 你知道如何为 iframe 制作它吗 或者你知道另一个代码吗 代码 center margin auto width 60 border 3px solid 73AD2

  • 如何将命名空间与 TypeScript 外部模块一起使用？

    我有一些代码 基本类型 ts export namespace Living Things export class Animal move export class Plant photosynthesize dog ts import

  • 如何在 JSP 编辑器中激活 javascript 的语法着色 - Eclipse

    在某些情况下 javascript 确实必须位于 JSP 页面中 而不是位于单独的文件中 有些框架还使用Javascript做一些事情 以便用户将其包含到JSP标签中 这样JS就不会出现在

  • 右列固定的 Div 表

    我最近接手了一个非营利网站作为一个项目 我正在使用一个现有的网站 所以我必须使用很多已经编程的东西 所以我所要做的就是创建设计 I made a diagram of basically what I can t figure out ho

  • 将 javascript 变量作为参数传递给 @url.Action()

    是否可以将javascript变量作为参数传递给 url Action 因为据我所知可能存在服务器和客户端问题 我的要求是我必须根据过滤器下载文件 并进行ajax调用不适用于下载文件 所以我对 url Action 进行了编码 但无法实现这

  • 如何设置javascript对象数组中所有对象的特定属性值（lodash）

    我有以下对象数组 var arr id a1 guid sdfsfd value abc status active id a2 guid sdfsfd value def status inactive id a2 guid sdfsfd

  • 开玩笑 setTimeout 不暂停测试

    it has working hooks async gt setTimeout gt console log Why don t I run expect true toBe true 15000 我已经查看了这个答案 Jest 文档和几

随机推荐

  • 将点表示法的 JavaScript 字符串转换为对象引用

    给定一个 JavaScript 对象 var obj a b 1 c 2 和一个字符串 a b 我怎样才能将字符串转换为点符号 这样我就可以走了 var val obj a b 如果字符串只是 a 我可以用obj a 但这更复杂 我想有一些

  • Xdocument 不打印声明

    我尝试使用domainpeople com API 为此我需要使用XML 目前我有一个错误 说 找不到 apiProtocol 我猜我的 Xml 文档格式错误 当前发送的 xml 是

  • 使用文件签名（.NET）中的幻数来验证文件类型的解决方案？

    我想验证上传文件的类型 假设文件的扩展名不正确 我认为这可以通过检查文件签名的幻数来完成 同样 既然如此在unix中完成 https stackoverflow com questions 2147484 how to get magic

  • 使用 SockJS 提供 auth 标头

    我有一个 Spring MVC 服务器 它提供了一堆 REST 端点以及一个 websocket 端点 除了登录端点之外的所有内容都需要身份验证 我正在使用 JWT 来验证来自客户端的请求 当用户登录时 我返回一个 X AUTH TOKEN

  • 在派生类中强制声明属性

    我最近阅读了有关属性和反射的内容 我认为这将是在我的程序中包含元数据的好方法 我有这个抽象类 我希望从它继承的所有类都用该类声明一些属性 因为我希望为我的程序创建自定义组件 那些派生类 并希望在运行时读取这些类的元数据 但是 派生类都必须显

  • Microsoft Windows Python-3.6 PyCrypto 安装错误

    pip install pycrypto在 python3 5 2 上工作正常 但在 python3 6 上失败并出现以下错误 inttypes h 26 错误 C2061 语法错误 标识符 intmax t Python安装目录下的文件i

  • Laravel：对象或其他结构（数组，json..）到视图？

    您可以通过多种方式将数据传递到 Laravel Blade 视图 在这场精明的讨论中Laravel 隐藏属性 例如密码 安全 https stackoverflow com questions 19033925 laravel hidden

  • 从 R Shiny 数据表中提取过滤器

    我有一个DT数据表 https rstudio github io DT 在 R Shiny 中 我通过设置启用了列过滤filter top within renderDT 我现在想要提取用户应用的过滤器 以便可以将它们保存在服务器端变量中

  • 在dragablz的所有其他选项卡中显示的另一个选项卡中文本框长度相似的虚线：TabablzControl wpf mvvm

    我在用dragablz TabablzControl在 Material Design first 选项卡中 我添加了文本框 但所有其他选项卡都存在与文本框类似长度的虚线 如何删除这条虚线 如果我使用普通选项卡控件 则不存在虚线 我使用时出

  • 在 Haskell 中将列表分组为 n 个元素的列表

    库中是否有对列表进行操作来生成 n 个元素的组 例如 n 3 groupInto 3 1 2 3 4 5 6 7 8 9 1 2 3 4 5 6 7 8 9 如果没有 我该怎么做 快速搜索Hoogle http www haskell or

  • TFS 域更改后删除重复的用户

    我们刚刚将 TFS 2013 3 服务器迁移到新域 一切似乎都按计划进行 我迁移了服务器 然后成功迁移了身份 但不是changing用户身份到他们的新域帐户 它刚刚添加了新帐户 所以现在每个人都在系统中twice 一般来说 我已经能够减轻这

  • 从 Scala 宏访问代码文件和行号？

    如何访问 Scala 宏中代码文件的名称和行号 我在看SIP 19 http docs scala lang org sips pending source locations html它说它可以很容易地使用宏来实现 编辑 为了澄清 我想要

  • Slickgrid - 一键复选框？

    当我在 Slickgrid 中创建复选框列 通过使用格式化程序 编辑器 时 我注意到需要单击两次才能与其交互 一次单击聚焦单元格 一次单击与复选框交互 这很有道理 但是 我注意到我可以一键与复选框选择器插件 用于选择多行 进行交互 有什么方

  • 根据 CRAN，什么是一个好的包名称？ [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我正在寻找一个我想发送到 CRAN 的 R 包的好名字 我没有找到任何有关 R 包命名良好实践的信息 那里是一个帖子 https stackov

  • 是否可以为 LaTeX 编写自己的“包”？

    作为一名程序员 我想知道是否可以为 LaTeX 创建自己的包 我需要类似著名的 列表 包的东西 但更能满足我的需求 我正在寻找一个列表解决方案 该解决方案会留意注释行 例如 BEGIN LISTING 3122 END LISTING 31

  • 类和结构之间的保留循环

    假设我有以下代码 struct X let propertyOfTypeY Y class Y var propertyOfTypeX X let y Y let x X propertyOfTypeY y y propertyOfType

  • 可拖动的内部框架类似于谷歌地图

    一直在玩javascript游戏的思想 特别是RTS类型 问题如下 我如何创建一个可拖动的内部框架 类似于谷歌地图 这个想法是 有一个重叠的 UI 下面有一个更大的可拖动地图 有点类似于您常见的 RTS 游戏 然而 我一直在尝试为这样的界面

  • cython 编译 - 导入与 cimport

    Cython 新手 也许这是一个基本问题 考虑两个例子 两者都取自这个博客在这里 http technicaldiscovery blogspot com 2011 06 speeding up python numpy cython an

  • paramiko 中的管道命令

    如何在 paramiko 中运行管道命令 我正在这样做 statement grep thing file grep thing2 tail 1 last msg conn execute statement 我得到的输出grep thin

  • 将 jquery 选择器存储在变量中

    在下面的示例中stored jQuery selector返回错误的值 是否可以存储选择器而不是结果 js代码 storing the jQuery selectors var container container element1 co

热门标签