相关疑难解决方法(0)

找到下一个匹配的兄弟姐妹的高效,简洁的方法?

坚持官方的jQuery API,有没有更简洁,但不是低效率,发现比其他指定选择相匹配的元素的下一个兄弟的方式nextAll:first伪类?

当我说官方API时,我的意思是不是黑客攻击内部,直接进入Sizzle,在混合中添加一个插件等等(如果我最终必须这样做,那就这样吧,但这不是这个问题的答案. )

例如,鉴于此结构:

<div>One</div>
<div class='foo'>Two</div>
<div>Three</div>
<div class='foo'>Four</div>
<div>Five</div>
<div>Six</div>
<div>Seven</div>
<div class='foo'>Eight</div>
Run Code Online (Sandbox Code Playgroud)

如果我有一个divin this(也许在一个click处理程序中,无论如何)并且想要找到与选择器"div.foo"匹配的下一个兄弟div,我可以这样做:

var nextFoo = $(this).nextAll("div.foo:first");
Run Code Online (Sandbox Code Playgroud)

...它有效(例如,如果我从"五"开始,它跳过"六"和"七"并为我找到"八"),但它很笨重,如果我想匹配任何一个的第一个几个选择器,它变得更加笨拙.(当然,这是一个很多更简洁比原始DOM循环将是...)

我基本上想要:

var nextFoo = $(this).nextMatching("div.foo");
Run Code Online (Sandbox Code Playgroud)

......哪里nextMatching可以接受全系列的选择器.我总是感到惊讶,next(selector)不这样做,但事实并非如此,并且文档清楚它的作用,所以......

我可以随时编写并添加它,但如果我这样做并坚持使用已发布的API,事情会变得非常低效.例如,一个天真的next循环:

jQuery.fn.nextMatching = function(selector) {
    var match;

    match = this.next();
    while (match.length > 0 && !match.is(selector)) {
        match = match.next();
    }
    return match;
};
Run Code Online (Sandbox Code Playgroud)

...... 明显nextAll("selector:first").这并不奇怪,nextAll可以把整个事情交给Sizzle,而Sizzle已经彻底优化了.上面的天真循环创建并丢弃各种临时对象,并且每次都必须重新解析选择器,没有什么大惊喜它很慢.

当然,我不能只是抛出一个:first …

jquery jquery-selectors

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

jQuery:如何选择"从这里到下一个H2"?

我正在用jQuery设置一个非常简单的FAQ页面.像这样:

<h2>What happens when you click on this question?</h2>
<p>This answer will appear!</p>
Run Code Online (Sandbox Code Playgroud)

这都是一个非常具体的div,所以我将选择标题$('#faq h2').简单吧?单击H2,然后使用this.next()以显示下一段.

(这个页面的警告是非程序员将维护它,这就是为什么我不使用类:不能保证任何新条目都有正确的类.)

所以!问题:

<h2>What happens when you click on the next question?</h2>
<p>That is an interesting conundrum.</p>
<p>Because the maintainer is kind of long-winded</p>
<p>and many answers will span a few paragraphs.</p>
Run Code Online (Sandbox Code Playgroud)

那么如何在没有添加divs和类以及诸如此类的东西的情况下,如何在我的this.next()例程中选择点击的问题和下一个问题(H2标题)之间的所有内容?

javascript jquery dom css-selectors jquery-selectors

30
推荐指数
4
解决办法
1万
查看次数

Css选择器 - 选择所有兄弟姐妹直到某个兄弟姐妹

我们希望避免对代码使用过多的类.

我们有以下html结构:

<div id='hello'></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div id='hello2'></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div id='hello3'></div>
<div></div>
<div></div>
Run Code Online (Sandbox Code Playgroud)

例如,我们如何选择所有div #hello,但直到#hello2

这可能只使用css选择器吗?

我们可以使用脚本语言(jquery)来实现吗?

更新:

尽管需要一个选择器,确实有效,但我需要将它放在一个javascript条件中......很抱歉没有提到它并且更清楚.

css jquery css-selectors css3

2
推荐指数
2
解决办法
2952
查看次数

标签 统计

jquery ×3

css-selectors ×2

jquery-selectors ×2

css ×1

css3 ×1

dom ×1

javascript ×1