Using JavaScript/jQuery to return a list of CSS selectors based on highlighted text
Posted
by Bungle
on Stack Overflow
See other posts from Stack Overflow
or by Bungle
Published on 2010-03-04T23:17:41Z
Indexed on
2010/03/19
18:41 UTC
Read the original article
Hit count: 754
I've been given some project requirements that involve (ideally) returning a list of CSS selectors based on highlighted text.
In other words, a user could do something like this on a page:
- Click a button to indicate that their next text selection should be recorded.
- Highlight some text on the page.
- See a generated list of CSS selectors that correspond to all the elements that contain the highlighted text.
Firstly, does this seem like a feasible goal? jQuery makes it easy to use a selector to access a particular element, but I'm not sure if the reverse holds true. If an element lacks an id attribute, I also don't know how you'd return an "optimized" selector - i.e., one that identifies an element uniquely. Maybe crawl up the DOM until you find an ID, then stem the selector from there?
Secondly, from a high-level perspective, any ideas on how to go about this? Any tips or tricks that could speed development? I very much appreciate any help.
Thanks!
© Stack Overflow or respective owner