I have an Website which is delivered with as xhtml (with header an doctype). I get data from the server which sometimes contains some entities what leads to an error when I try to set a string containing this via innerHTML. How I have already found out I can replace all of this items on serverside, but what I would like to know is:
Can I also add this entities to the doctype declaration instead of replacing it on server?
EDIT:
in other words, why does this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"
[
<!ENTITY nbsp " ">
]>
just not work?
Update 2:
From http://www.w3.org/TR/2008/WD-html5-20080610/dom.html#innerhtml1 (2nd part on setting), the algorithm for XHTML does not seem to mention whether it is aware of the DOCTYPE information, though it is aware of the namespaces at least. (Note I switched to the simpler yet standards-compliant XHTML5 DOCTYPE.)
I think you might either provide the following test-case and report as a bug, or perhaps bring it up on the WhatWG mailing list, as I think the behavior should at least be spec'd(unless it is, and I am just not seeing it):
<!DOCTYPE html [
<!ENTITY nbsp " ">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<div id="a">old text</div>
<script><![CDATA[
document.getElementById('a').innerHTML = 'new text';
]]></script>
</html>
In the meantime, if you don't want to replace on the server, you could use such a hack as below with DOMParser():
<!DOCTYPE html [
<!ENTITY nbsp " ">
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<div id="a">old text</div>
<script><![CDATA[
document.getElementById('a').innerHTML = new DOMParser().parseFromString(
'<!DOCTYPE html [<!ENTITY nbsp " ">]>'+
'<html xmlns="http://www.w3.org/1999/xhtml">'+
'new text'+
'</html>',
'application/xhtml+xml'
).documentElement.innerHTML;
]]></script>
</html>
Related
Using xslt to generate web-content (QXmlQuery), the resulting xhtml page has self-closed tags, which I am unable to make browsers to understand.
The problem relates with major browsers keeping parsing the self-closed tag as if it was HTML5, thus, including following content inside the self-closed tag.
Example:
<a><xsl:attribute name="name"><xsl:value-of select="#title"/></xsl:attribute></a>
Will generate content like:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
...
<a name="Intro"/>
Some content
Which is then interpreted in the browser as:
<a name="Intro">Some content</a>
A trivial, but not elegant solution is to add a comment:
<a><xsl:attribute name="name"><xsl:value-of select="#title"/></xsl:attribute><xsl:comment/></a>
I would like to understand the problem:
Is xhtml deprecated? If this is the case, then xslt for web generation is deprecated too?
If not deprecated, how to enable proper parsing of xhtml for modern browsers? (with proper, I mean with support for self-closed tags).
I tried several DOCTYPEs, and looked about the possible xslt deprecation without results. But I have to admit that I have been out of web development for a while, forgive me if this is a trivial question.
Full example:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title</title>
</head>
<body>
<div>
<span/>
Dummy content
</div>
</body>
</html>
Which can be seen with "Dummy content" wrongly inside span
I can't figure out how to get CSS attribute selectors to style elements based on namespaced attributes without resorting to the ordinary HTML name of the namespaced attribute (including the colon).
Example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:foo="https://stackoverflow.com/foo">
<head>
<title>CSS Attribute Selectors with namespaces</title>
<style>
#namespace foo "http://www.stackoverflow.com/foo";
span[foo|id=bar] { font-family: monospace; font-weight: bold; }
</style>
</head>
<body>
<span foo:id="bar">Should be monospace bold</span>
</body>
</html>
Test case:
I opened the file in both Chrome and Firefox by typing the appropriate file:/// URL into my address bar; in neither case does it show up correctly. It also does not show up correctly on Stack Overflow.
If I change the snippet to include the HTML attribute name:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:foo="https://stackoverflow.com/foo">
<head>
<title>CSS Attribute Selectors with namespaces</title>
<style>
#namespace foo "http://www.stackoverflow.com/foo";
span[foo\:id=bar] { font-family: monospace; font-weight: bold; }
</style>
</head>
<body>
<span foo:id="bar">Should be monospace bold</span>
</body>
</html>
... it works correctly (both using my local browser and on the Stack Overflow snippet).
I've read the set of gotchas included in Can you style XHTML elements in another namespace using id and class name css selectors? and Do CSS namespace attribute selectors work with XHTML/HTML elements? but I have not yet been able to figure this out; I believe I've done everything both questions' answers suggest.
Removing the DOCTYPE didn't do it, although I suspect some kind of DOCTYPE problem given that the HTML form works and the XHTML form does not.
I must be missing something simple!
Your document needs to be processed as an XHTML document for the XML namespaces to work. Note that having an XHTML DOCTYPE and the relevant xmlns attributes is not enough.
You do this on the server side by serving the document as Content-Type: application/xhtml+xml, or on the file system by saving the document with a .xhtml file extension instead of .html. For a very quick and dirty test case you can even copy your entire markup, drop it in the address bar, prepend data:application/xhtml+xml,, and navigate to the resulting data URI.
This is mentioned in very brief passing by the first question you link to:
If I switched the mime-type to application/xhtml+xml
Note also that the namespace in your CSS must exactly match the namespace in the markup. #namespace foo "http://www.stackoverflow.com/foo"; does not match xmlns:foo="http://stackoverflow.com/foo" because of the www.. (Interestingly, the foo identifiers do not need to match, because unlike the namespaces themselves the identifiers are separate.)
The raw XHTML is just displaying in internet explorer. No CSS is shown at all. I can't seem to pinpoint the issue of this problem. I ran both my XHTML and CSS through the W3C validators and had zero errors checked with XHTML 1.0 Strict and CSS 2.1.
I suspect the something to do with my DOCTYPE or the <link> in my XHTML. Any help is appreciated!
XHTML (DOCTYPE and HEAD):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!-- DOCTYPE is set to STRICT-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Flags</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="Flags.css" type="text/css" />
</head>
</html>
Page in:
Internet Explorer: http://i.imgur.com/l2jcUkv.png
Chrome: http://i.imgur.com/tucKXzg.png
Notes: The CSS is called Flags.css and is located in the same directory as the XHTML.
Check the developer tools in Internet Explorer. Are you using the correct mime for your CSS? What about headers you've set?
Remove the meta element, it is not only invalid it's completely out of context for XHTML; you are setting the mime to application/xhtml+xml right?
Never use capitol letters for files unless they are intended as an explicit download-only resource; all web resources must be lower case as part of your good practices (and use dashes for public facing URLs, never underscores; research correct context of characters on Wikipedia).
Finally you're lacking the media attribute with the screen value...
<?php
if (isset($_SERVER['HTTP_ACCEPT']) && stristr($_SERVER['HTTP_ACCEPT'],'application/xhtml+xml'))
{
header('Content-Type: application/xhtml+xml; charset=utf-8');
}
echo '<?xml version="1.0" encoding="UTF-8"?>'."\n";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Flags</title>
<link href="flags.css" media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
</body>
</html>
My entire site is proper XHTML (1.1 currently, converting to XHTML5 for the next version release) so feel free to look at it linked from my user profile.
I have created a webpage (http://www.snow4life.yum.pl) that was rendered properly in firefox, chrome etc. Of course dumb IE complicated things, because it enters quirk mode automatically, even though doctype is properly set and site goes through w3 validation (there is one error of missing some char, but file was cleared in hex editor). How can I stop ie from entering quirks mode ? Is there any way ?
Try killing all the whitespace before the DOCTYPE.
EDIT: There is an <feff> character which is a Unicode BOM signature at the start of the file. Since you may not have a text editor that can actually see that, try deleting the entire first line and paste over it with
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
And do NOT save the file with a BOM unicode signature. If this doesn't work, try a different text editor altogether.
Paste the below code within the head tag
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
Quirks mode in any version of IE will also be triggered if anything precedes the DOCTYPE.
For example, if a hypertext document contains a comment, space or any tag before the DOCTYPE declaration, IE will use quirks mode:
<!-- This comment will put IE 6, 7, 8, and 9 in quirks mode -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
I added both the doctype from the first comment and then the meta tag and it worked thanks guys .... and no thanks to IE :(
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
and
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
I have just changed the doctype to html5 and it still works great
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
I am trying to extend an xhtml document to allow extra attributes.
In the w3.org it gives an example like so:
<!ATTLIST a
myattr CDATA #IMPLIED
>
See: 6.1. Defining additional attributes -
http://www.w3.org/TR/1999/xhtml-modularization-19990406/developing.html#s_dev_attrs
However i am not sure where to put that statement.
I have tried adding it like so:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<!ATTLIST a
myattr CDATA #IMPLIED
>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
...
</head>
<body>
...
</body>
But when I pick up the doc using DOM that extra DTD statement is ignored.
I have also tried:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" [
<!ATTLIST a
myattr CDATA #IMPLIED
>
]>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
...
</head>
<body>
...
</body>
But that really caused DOM to throw a wobbly.
So I'd appreciate it if someone could show me a sample xhtml document that has an additional attribute defined. (i.e minimal full doc that could validate)
As you might have guessed....xhtml is not my strong point.
Your second example is correct, apart from the missing </html> end-tag. With that added it parses OK for me. What exactly “throws a wobbly”?
The ATTLIST declaration must indeed go in the DTD, the internal subset of which is within square brackets inside the DOCTYPE declaration.
(What are you hoping to achieve with this? Browsers don't care, even if they are running in native application/xhtml+xml mode. In normal text/html tag soup mode the DTD internal subset will just confuse them.)