标签: jquery-selectors

哪个更有效:.parent().parent().parent()〜或〜parents(".foo")〜或~extree(".foo")

我有一个A标签,触发它的伟大伟大的祖父母的动画.以下所有方法都有效,但效率最高,为什么?

$(this).parent().parent().parent().parent().parent().animate(...);

$(this).parents(".foo").animate(...);

$(this).closest(".foo").animate(...);
Run Code Online (Sandbox Code Playgroud)

我怀疑第一个可能是,因为它是最明确的,但出于维护原因(嵌套可能会改变)我更喜欢第二个.它们在实践中似乎都很顺利.

jquery jquery-selectors

33
推荐指数
3
解决办法
1万
查看次数

JQuery创建新的选择选项

我在常规JavaScript中创建选择选项具有以下功能.有没有办法用jQuery做到这一点而不必使用表单对象?也许将选项存储为JSON对象数组并在调用函数中解析它...

function populate(form)
{
form.options.length = 0;
form.options[0] = new Option("Select a city / town in Sweden","");
form.options[1] = new Option("Melbourne","Melbourne");
}
Run Code Online (Sandbox Code Playgroud)

以下是我如何调用上面的函数:

populate(document.form.county); //county is the id of the dropdownlist to populate.    
Run Code Online (Sandbox Code Playgroud)

html javascript jquery jquery-selectors

33
推荐指数
6
解决办法
12万
查看次数

jQuery:给定一个选择器,只找到它的可见元素

这应该很简单.我有一个我已经声明为$ listItems的变量.声明如下:

var $listItems = $ul.children('li'); // $ul is just a selected unordered list
Run Code Online (Sandbox Code Playgroud)

稍后在我的代码中,我只想获得当前可见的那些.我该怎么办呢?就像是:

$listItems.parent().children(':visible')?
Run Code Online (Sandbox Code Playgroud)

谢谢.

jquery hidden jquery-selectors

33
推荐指数
1
解决办法
3万
查看次数

将jquery选择器存储在变量中

在以下示例中,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 );
Run Code Online (Sandbox Code Playgroud)

为什么,如果我使用容器选择器来查找元素,它有效吗?这是因为选择器返回pointer匹配的元素而不是元素?

// this works …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery jquery-selectors

33
推荐指数
2
解决办法
5万
查看次数

使用jQuery在下拉列表中获取所选值.

我的HTML在下面.我需要Scheduled使用<select>标签获取选定的值() .如何使用jQuery完成?

<select id="availability" style="display: none;">
  <option value="Available">Available</option>
  <option selected="selected" value="Scheduled">Scheduled</option>
  <option value="Unavailable">Unavailable</option>
</select>
Run Code Online (Sandbox Code Playgroud)

我做了一个jQuery("#availability")获取select标签,但我不知道如何获得所选选项的价值.

jquery jquery-selectors

32
推荐指数
4
解决办法
12万
查看次数

jQuery之间的区别:eq()和:nth-​​child()

在jQuery中,使用eq()和:nth-​​child()来选择任何元素之间的一些主要区别是什么?

同样一般来说,对于起始索引,在这种情况下它是从"0"开始还是从"1"开始?

javascript jquery dom jquery-selectors

32
推荐指数
3
解决办法
3万
查看次数

如何使用jQuery选择表列

我想选择一个表列,我所知道的是列的标题文本.(th.innerText)

我尝试了以下代码,但它不起作用:

ownerIndex = $('th:contains("Owner")').index();
$('table tr td:nth-child(ownerIndex)')
Run Code Online (Sandbox Code Playgroud)

有任何想法吗?

jquery html-table jquery-selectors

32
推荐指数
2
解决办法
6万
查看次数

JQuery不是第一个子选择器

我有以下标记:

<div class="feed-item">
  <div class="date-header">2012-06-03</div>
</div>
<div class="feed-item">
  <div class="todo">Todo</div>
</div>
<div class="feed-item">
  <div class="meeting">meeting</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我想只显示不同类名的div,例如class ="todo"并保持"date-header"可见.我有以下javascript"

$('.feed-cluster,.feed-item-container').not('div:first.date-header').not(className).slideUp(speed, function(){
      $('.feed-cluster' + className + ',.feed-item-container' + className).slideDown(speed);
});
Run Code Online (Sandbox Code Playgroud)

一切正常,除了我试图排除类名为date-header的第一个孩子的位置:

.not('div:first.date-header')
Run Code Online (Sandbox Code Playgroud)

有人可以建议替代方案吗?

javascript jquery jquery-selectors

32
推荐指数
3
解决办法
5万
查看次数

为什么函数伪如:not()和:has()允许引用参数?

显然,正如我在评论另一个答案时发现的那样,jQuery(而不是它的底层选择器引擎Sizzle)允许你将参数引用到:not()选择器和:has()选择器.:

$('div:not("span")')
$('span:has("span")')
Run Code Online (Sandbox Code Playgroud)

Selectors标准中,引号始终代表字符串,而不是选择器或关键字,因此引用参数:not()始终无效.这在选择器4中不会改变.

您还可以通过添加不受支持的CSS选择:nth-last-child(1) 器来查看它是非标准语法,例如导致选择器完全失败:

$('div:not("span"):nth-last-child(1)')
$('span:has("span"):nth-last-child(1)')
Run Code Online (Sandbox Code Playgroud)

在这里允许报价是否有任何理由,技术或其他方面?想到的唯一可能性是:

  • 一致性:contains()允许引用和不引用的参数,如旧的选择器规范中所示.除了:contains()接受字符串/关键字,而不是选择器...

  • 与自定义伪使用的实现保持一致$.expr[':'],始终允许引用和不引用的参数.

  • 一致性和易用性移植到他们的方法同行.not().has()(只是删除或拆分外报价和改变冒号期?).

但我找不到任何支持或反对它们的消息来源.实际上,引用选择器参数本身的能力也没有在任何地方记录,引用和引用参数之间似乎没有任何区别:

$('div:not(span)')
$('span:has(span)')
Run Code Online (Sandbox Code Playgroud)

javascript jquery jquery-selectors sizzle

32
推荐指数
1
解决办法
1083
查看次数

jQuery重复选择器错误

我目前正在尝试设置一个包含6个可点击的cels的表,允许输入框出现,这样你就可以添加注释但是我得到了一个重复的jQuery选择器错误,并且还通过调试我发现的第二个函数.html()也没有用.这是我的6个函数的代码; 单击特定单元格时调用每个单元格:

$("#mondayCommentLink").click(function (){
    var mondayhtmls = $("#mondayComment");
    var input = $("<input type='text' id='mondayCommentText' name='mondayCommentText'  />");
    input.val(data.days[0].comment);
    mondayhtmls.html(input);
});

$("#tuesdaysCommentLink").click(function (){
    var tuesdayhtmls = ("#tuesdayComment");
    var inputt = $("<input type='text' id='tuesdayCommentText' name='tuesdayCommentText' />");
    inputt.val(data.days[1].comment);
    tuesdayhtmls.html("test");
});

$("#wednesdayCommentLink").click(function (){
    var htmls = ("#wednesdayComment");
    var input = $("<input type='text' id='wednesdayCommentText' name='wednesdayCommentText' />");
    input.val(data.days[2].comment);
    htmls.html(input);
});

$("#thursdayCommentLink").click(function (){
    var htmls = ("#thursdayComment");
    var input = $("<input type='text' id='thursdayCommentText' name='thursdayCommentText' />");
    input.val(data.days[3].comment);
    htmls.html(input);
});

$("#fridayCommentLink").click(function (){
    var htmls = ("#fridayComment");
    var input …
Run Code Online (Sandbox Code Playgroud)

jquery duplicates jquery-selectors

32
推荐指数
3
解决办法
3万
查看次数