Question

Without going into specifics why I’m doing this… (it should be encoded to begin with, but it’s not for reasons outside my control)

Say I have a bit of HTML that looks like this

<tr data-path="files/kissjake's files"">...</tr> so the actual data-path is files/kissjake's files"

How do I go about selecting that <tr> by its data path?

The best I can currently do is when I bring the variables into JS and do any manipulation, I URLEncode it so that I’m always working with the encoded version. jQuery seems smart enough to determine the data-path properly so I’m not worried about that.

The problem is on one step of the code I need to read from a data-path of another location, and then compare them.

Actually selecting this <tr> is what’s confusing me.

Here is my coffeescript

oldPriority = $("tr[data-path='#{path}']").attr('data-priority')

If I interpolate the URLEncoded version of the path, it doesn’t find the TR. And I can’t URLDecode it because then jQuery breaks as there are multiple ‘ and ” conflicting in the path.

I need some way to select any <tr> that matches a particular data-attribute, even if its not encoded in the html to begin with

Answer 1

First, did you mean to have the extra " in there? You will have to escape that, as it’s not valid HTML.

<tr data-path="files/kissjake's files&quot;">...</tr>

To select it, you need to escape inside the selector. Here’s an example of how that would look:

$("tr[data-path='files/kissjake\\'s files\"']")

---

Explanation:

\\' is used to escape the ' inside the CSS selector. Since ' is inside other single quotes, it must be escaped at the CSS level. The reason there are two slashes ‘\` is we must escape a slash so that it makes it into the selector string.

Simpler example: 'John\\'s' yields the string John\'s.

\" is used to escape the double quote which is contained inside the other double quotes. This one is being escaped on the JS level (not the CSS level), so only one slash is used because we don’t need a slash to actually be inside the string contents.

Simpler example: 'Hello \"World\"' yields the string Hello "World".

---

Update

Since you don’t have control over how the HTML is output, and you are doomed to deal with invalid HTML, that means the extra double quote should be ignored. So you can instead do:

$("tr[data-path='files/kissjake\\'s files']")

Just the \\' part to deal with the single quote. The extra double quote should be handled by the browser’s lenient HTML parser.