Best IT Recipes

Jquery selector for <link> elements in <head>

We use jQuery to parse some HTML. Then I need to go through this document and find some elements. Among the elements I need to find are <link> elements.

This works great to extract all <a> elements:

 $(string).find("a")

but this does not help to extract the <link> elements:

 $(string).find("link")

The string parameter is the html content (for example, received on request).

Any idea why? (I think find applies only to <body> elements). Also, any idea on how to actually extract these <link> elements?

+13
jquery dom
Jun 20 2018-11-11T00:
source share
4 answers

From the documentation of the function you use for $(string) (which is the jQuery( html, [ownerDocument] ) function jQuery( html, [ownerDocument] ) ):

When transmitting in complex HTML, some browsers cannot create DOMs that accurately replicate the HTML source provided. As already mentioned, we use the browser.innerHTML property to parse the passed HTML and paste it into the current document. During this process, some browsers filter out certain elements such as <html> , <title> or <head> . . As a result, the inserted items cannot be representative of the original string passed.

Try not to use jQuery to manage entire HTML documents.

Note in particular that the link node in a separate HTML fragment can be “found” just fine .

+8
Jun 20 '11 at 20:59
source share

Well, based on what I can find in jQuery source code , the engine itself will not create tags (or snippets) that are not "properly seated." Even when passing a string, jQuery recognizes that the header is already set and will not generate it.

In the end, when jQuery is passed an HTML string, it actually calls document.createElement and creates a list of arrays of these elements.

EDIT . After a little research, it looks like the browser is actually restricting the creation of the element, not jQuery. In any case, you still have missing tags. This leads me to the same conclusion below.

As much as I don't like this, there might be time to manipulate the regex / string.

+1
Jun 20 '11 at 20:50
source share

jQuery cannot do this, but your browser may: (Do not try to parse HTML with regular expression as intended.)

 txt = '<DIV><LINK>a</LINK><B>jelo</B></DIV>'; if(window.DOMParser) { parser=new DOMParser(); xmlDoc=parser.parseFromString(txt,"text/xml"); } else { // Internet Explorer xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.async="false"; xmlDoc.loadXML(txt); } xmlDoc.getElementsByTagName('LINK');

Remember that XML is case sensitive, so you need to look for “LINK” using the same case as in HTML.

0
Jun 21 2018-11-11T00:
source share

Like the @pimvdb pointer, this does not work:

 alert($("<div><link>Test</link></div>").find("link").text());

The explanation is correct:

Sizzle uses context.getElementsByTagName, which fails because the elements are not in the DOM.

But this way of working:

 alert(("link", $("<div><link>Test</link></div>")).text());

And for some guys who said the second one doesn't work: http://jsfiddle.net/ErickPetru/5Qs3M/ . But, of course, it clearly does not find elements that are not in the DOM (i.e., On head ).

-2
Jun 20 2018-11-18T00:
source share


More articles:


All Articles