jquery / jquery/api.jquery.com

Documentation: Behavior of :nth-of-type when combined with another selector

Open
#799 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
HTML
Stars
325
Forks
260
PR merge metrics
No merged PRs in 30d

Description

It seems to be a rather common pitfall to use :nth-of-type and :nth-child together with a class selector.

tr.row:nth-child(odd)

I see it would be useful that the documentation of :nth-of-type and :nth-child would explicitly warn that this construct won't probably do what a developer not that familiar with selectors would expect.

Note! When combining selectors, there is no notion of order among simple selectors, the following two compound selectors are equivalent:

table.myClass tr.row:nth-child(odd)
table.myClass tr:nth-child(odd).row

They both mean select any tr element that matches all of the following independent conditions:

it is an odd-numbered child of its parent;
it has the class "row"; and
it is a descendant of a table element that has the class "myClass".

This is mainly cut&pasted from : http://stackoverflow.com/questions/5545649/can-i-combine-nth-child-or-nth-of-type-with-another-selector

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the existing documentation entries for :nth-of-type and :nth-child; no file or test path is specified in the issue. Review the proposed warning and examples against selector behavior, and consider the work done when both entries clearly explain how positional pseudo-classes behave when combined with a class selector.

Written by the indexing model from the issue text.

Assessment

Tech stack
css
Domain
documentation
Issue type
Documentation
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.