in dom, what is functional difference between an html element and a fragment?

Question

have found fragments to be very useful in constructing dynamic html - like using a bag of html elements and the bag itself dissolving when put into place - very nice.

I had assumed the methods for html elements and fragments were the same, but I think this is incorrect.

it seems that fragments have node methods - appendChild() etc - but do not have more sophisticated html element methods, for example, getElementsByTagName().

is this assessment correct? or am I shooting myself in the foot in a new way?

Answer 1

A DocumentFragment extends the Node interface and is defined as,

interface DocumentFragment : Node {
};

An HTMLElement extends from Element, and its interface is defined as,

interface HTMLElement : Element {
    attribute DOMString id;
    attribute DOMString title;
    attribute DOMString lang;
    attribute DOMString dir;
    attribute DOMString className;
};

Element in-turn extends the Node interface. It contains the method getElementsByTagName among several others,

interface Element : Node {
    ...
    NodeList getElementsByTagName(in DOMString name);
    ..
};

So to answer your question in short, a document fragment and an html element both share the node interface.

Answer 2

The DocumentFragment interface extends the Node interface, thus providing methods to insert and clone elements, but not getElementsByTagName() and the like. These are to be found in the Document interface (which also extends Node).