CODEWITHSUNDEEP
html
gene b.
gene b.

Reputation: 11984

Embedding HTML with <object>/<embed> introduces BODY and HTML tags

I need to embed a sub-HTML into another HTML. I am using 2 approaches,

<object type="text/html" data="test.html"></object>

OR

<embed type="text/html" src="test.html">

But this inserts HEAD and BODY tags, even though my sub-page doesn't have them. By sub-page test.html only contains the following and nothing else

<div>
    <p>Test Paragraph</p>
</div>

Resulting DOM:

enter image description here

This could introduce HTML validation issues and spacing. Do people use these approaches at all? Is there a way to embed without the extra HEAD/BODY?

NOTE Cannot use iframes, they are outdated & introduce other problems.

Upvotes: 1

Views: 1059

Answers (1)

Mi-Creativity
Mi-Creativity

Reputation: 9654

You have varied options to choose from, having iframes aside, you can:

  • use a javascript framework/lib which gives you the option to load the "sub-page" via Ajax, for example in jQuery, the .load() function.

  • use server-side language, i.e in PHP you can just use include, include_once, require, or require_once.

  • HTML Imports, <link rel="import" href="path-to-file/filename.html">, are the best and IMHO this should've been implemented long time ago, but the problem is it lacks wide browsers support, only Chrome and Opera currently, caniuse.com/imports

Upvotes: 1

Related Questions