Is it possible to create an HTML quine?

Question

Per the title, is it possible to create a (non-trivial) quine in HTML?

My definition of an HTML quine:

A non-trivial HTML quine is one that is not null and uses at least one HTML tag, under the assumption that some string in an HTML file is rendered by a browser as plain text. An HTML quine is defined such that the output of the q.html as rendered by a standard browser is the contents of q.html itself.

(I'm open for any comments on this definition, I kind of hacked it up right now)

HTML is not turing-complete, therefore the fixed-point theorem cannot be applied to prove that it is indeed possible.

However, this does not necessarily mean an HTML quine is impossible. Or can it in fact be proven that an HTML quine is impossible?

Surely this belongs on http://cstheory.stackexchange.com/ and not here? — Oded, Dec 06 '11 at 13:25
Since HTML is not executed, you may want to clarify what you consider the "output" of it... — deceze, Dec 06 '11 at 13:30
@Oded, I agree this is borderline CS theory, but I am looking for an HTML-specific answer. — Yuval Adam, Dec 06 '11 at 13:33
I agree with @deceze, by the definition of a Quine from your link HTML is not a "computer program" it is a markup language and does not "execute". If you could include Javascript then that's a different story, you could load the same document source for display — Brad, Dec 06 '11 at 14:35
@Brad - that's why I updated what my definition of an HTML quine is. — Yuval Adam, Dec 06 '11 at 16:30
Just found this project: https://secretgeek.github.io/html_wysiwyg/html.html — Rocket Nikita, Jan 13 '21 at 09:26

score 20 · Accepted Answer · answered Oct 08 '12 at 20:47

It's certainly not possible with "plain" HTML. Obviously it would be possible to do with JavaScript, but it's also possible with CSS:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>This is the title</title>
<style type="text/css"><![CDATA[ 
* {
  display:inline;
  white-space:pre;
}
html:last-child {
  white-space:normal;
}
html:before  {content:'<html xmlns="http://www.w3.org/1999/xhtml">';}
html:after   {content:'</html>';}
head:before  {content:'<head>';}
head:after   {content:'</head>';}
title:before {content:'<title>';}
title:after  {content:'</title>';}
style:before {content:'<style type="text/css"><![CDATA[';}
style:after  {content:']]\00003e</style>';}
body:before  {content:'<body/>';position:absolute;left:0;}
]]></style>
</head>
<body/>
</html>

Nice idea. Firefox is not processing that nicely though. What am I missing? — Yuval Adam, Oct 09 '12 at 17:59
Firefox obviously doesn't always realize that it's XHTML and parses it as "normal" HTML, failing to properly parse the CDATA escaped style content. Saving the code as local quine.xhtml makes Firefox handle it proplery for me, though. — Thomas W, Oct 10 '12 at 10:59

Rob · Answer 2 · 2011-12-14T20:34:32.253

This is not possible. Since every unescaped element will be interpreted as markup by the browser, the browser will attempt to render or handle the contents of those elements or as a control. You cannot display an element that is not escaped in some way, such as with the <pre> tag. But then such tags will also not be displayed.

Of course, you could serve it as text/plain with appropriate HTTP headers but, then, that's not HTML. Just using the .html extension will make browsers render it as html anyway in most (all?) cases.

score -1 · Answer 3 · 2020-11-21T20:01:22.917

You can't.

<!DOCTYPE html>
<html>
<head>
<title></title>
<head>
<body>
<div id="quine" ></div>
<script>
document.getElementById("quine").innerHTML = document.documentElement.innerHTML.replace(/\&/g, "&amp;" ).replace(/\</g, "&lt;" ).replace(/\>/g, "&gt;");
</script>
</body>
</html>

You can cheat though and do

<body onload="document.getElementById("quine").innerHTML = document.documentElement.innerHTML.replace(/\&/g, "&amp;" ).replace(/\</g, "&lt;" ).replace(/\>/g, "&gt;");" >
<div id="quine" ></div>
</body>

score -6 · Answer 4 · answered Apr 05 '12 at 21:02

-6

Sure, just like with all HTML "what ifs", the answer is just use JQuery!

answered Apr 05 '12 at 21:02

devshorts

8,572
4
50
73

While I realize my statement was kind of in jest, you really could do this with javascript. An HTML quine would only mean that if hte markup is "
" that when it renders it also writes "
" but you could modify the actual markup and do whatever you want with javascript. Nobody said that modifying the DOM doesn't count. – devshorts Apr 05 '12 at 21:08

Is it possible to create an HTML quine?

4 Answers4