JQuery and frame(set)s - why do they disappear?

Question

When I use the console and I try to create an element with tag frameset, I get no result:

$('<div id="content" data-something="hello" />')
=> [<div id=​"content" data-something=​"hello">​</div>​]
$('<frameset frameborder="0" framespacing="0" marginwidth="0" marginheight="0" framespacing="0" border="0"></frameset>')
=> []

This behaviour persists across multiple JQuery versions (like 1.10.2, 2.0.0 and 1.2.6 etc.)

How can I read the 'frameborder' (for example) attribute from this frameset without having to build a parser by mself?

P.S. (If you wonder why I use frames) This line (or a line like this) is a response from an external (more or less) API that I cannot change. I would just like to read the information and go on.

Answer 1

I used a workaround:

var sourceWithFrames = ...
sourceWithFrames = sourceWithFrames.replace(/<frame/g, '<xyzFrame')
// e.g. 
var frameborder = $(sourceWithFrames).find('xyzFrameset').attr('frameborder')
// and so on

This is, in my opinion, the best way to approach this (and probably the only one...)

Answer 2

The frameset tag is to be used as the body of framed documents in place of the body tag, and in conjuction with the frameset document type declaration. It is considered obsolete since HTML5.

---

To solve your issue, your best bet is to parse the portions you require from the string on your own or use an HTML parsing library such as htmlparser.js

Answer 3

The attributes on your frameset element are not valid HTML, so jQuery does not create it. It will work if you take them out. You can then add the attributes one at a time using .attr.

var x = $('<frameset></frameset>');
x.attr('frameborder', '0');
x.attr('framespacing', '0');
x.attr('border', '0');  

But the added code and resource cost of creating an element is not necessary just to find an attribute value in the string. You can find the substring you are looking for with the match method like this:

var frameborder = '<frameset frameborder="0" border="0"></frameset>'.match(/frameborder="(.+?)"/)[1]

Just replace 'frameborder' in the regex with the name of another attribute to get its value. Simple.