I've got a plete HTML document I'm pulling in with $.ajax(), and my .done() callback looks like this:
function (data, text_status, jq_xhr) {
var $what_i_want = $(data).find('#what-i-want');
}
where data is a string that contains the entirety of a well-formed HTML document. This code never reaches .find().
Upon $(data), I get:
`Uncaught Error: Syntax error, unrecognized expression: <!DOCTYPE html>`...
The facts:
- I'm using jQuery 1.9.0
- The document is well-formed HTML5 according to the W3C validator.
I've used jQuery() to objectify many an HTML string, so I'm surprised this isn't working. Admittedly, I don't recall ever trying a whole document. Given the error, I'm guessing, perhaps, I need to escape this string somehow. But I'm not sure how.
Incidentally, this works:
var $what_i_want = $('#what-i-want', $.parseHTML(data))
But I can't figure out why the first approach fails.
I've got a plete HTML document I'm pulling in with $.ajax(), and my .done() callback looks like this:
function (data, text_status, jq_xhr) {
var $what_i_want = $(data).find('#what-i-want');
}
where data is a string that contains the entirety of a well-formed HTML document. This code never reaches .find().
Upon $(data), I get:
`Uncaught Error: Syntax error, unrecognized expression: <!DOCTYPE html>`...
The facts:
- I'm using jQuery 1.9.0
- The document is well-formed HTML5 according to the W3C validator.
I've used jQuery() to objectify many an HTML string, so I'm surprised this isn't working. Admittedly, I don't recall ever trying a whole document. Given the error, I'm guessing, perhaps, I need to escape this string somehow. But I'm not sure how.
Incidentally, this works:
var $what_i_want = $('#what-i-want', $.parseHTML(data))
But I can't figure out why the first approach fails.
Share Improve this question edited Apr 15, 2013 at 19:20 Dmitry Minkovsky asked Feb 27, 2013 at 3:04 Dmitry MinkovskyDmitry Minkovsky 38.1k29 gold badges123 silver badges168 bronze badges 4- I bet it's thinking that the document is not an HTML fragment, but a selector. If you stripped out the DOCTYPE I bet it'd work :-) – Pointy Commented Feb 27, 2013 at 3:12
- Did you tried with $what_i_want = data.find('#what-i-want') too? – earthdesigner Commented Feb 27, 2013 at 3:14
- 1 FYI jquery./upgrade-guide/1.9/…. This is somewhat related to your issue. But more for your reference. If you are returning a full html document this will cause other issues as well. – Brian Commented Feb 27, 2013 at 3:19
-
@Brian: hey, that's pretty interesting. Thanks for that link. Yeah, I don't think it's directly related, but it's definitely at least cursorily related. I feel like all signs point to the correct usages being
$(snippet_string)and$.parseHTML(document_string). I wonder what the "official" word is on when to use$()and when to use$.parseHTML(). – Dmitry Minkovsky Commented Feb 27, 2013 at 3:27
2 Answers
Reset to default 15I had this same issue in a case where it was working on all sorts of other pages. They key for me was reading Brian's link on the upgrade-guide. The issue was this one page had a single blank line before the so even though I was only attempting to insert a portion of the returned html, it was not considering the returned data to be html. From the upgrade guide
As of 1.9, a string is only considered to be HTML if it starts with a less-than ("<") character.
Since it started with a blank line and not < it was not considered to be html. Thought I would add this contribution since I spent forever trying to figure out what the issue was.
DOCTYPE isn't an normal html tag; I think it would need to be removed.
It might have trouble with body as well, since you can't embed a whole document within another. IIRC the internal method in jquery is just creating a span on the fly and updating the innerHTML.