jQuery() on a well-formed HTML string results in Syntax Error, unrecognized expression

Question

I've got a complete 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 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
– Pointy, Commented Feb 27, 2013 at 3:12
Did you tried with $what_i_want = data.find('#what-i-want') too? — earthdesigner
– earthdesigner, Commented Feb 27, 2013 at 3:14
FYI jquery.com/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
– 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
– Dmitry Minkovsky, Commented Feb 27, 2013 at 3:27

Phil · Accepted Answer · 2013-04-13 21:19:03Z

15

I 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.

answered Apr 13, 2013 at 21:19

Phil

2731 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Dmitry Minkovsky Over a year ago

Interesting! Thanks for the feedback.

Al W Over a year ago

oye! what an annoying bug...yes, i'm calling it a bug. do you know if they change that in any other 1.9.X version?

colllin Over a year ago

This annoying solution works for me... jQuery(jQuery.trim(' <stuff> '))

Kevin Seifert · Accepted Answer · 2013-02-27 03:13:34Z

2

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.

edited Feb 27, 2013 at 3:13

answered Feb 27, 2013 at 3:12

Kevin Seifert

3,5921 gold badge21 silver badges14 bronze badges

Collectives™ on Stack Overflow

jQuery() on a well-formed HTML string results in Syntax Error, unrecognized expression

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related