可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

Using what I believe to be pretty standard embedded svg:

<!DOCTYPE html>
<html>
<body style="padding:50px">

  <svg width="100" height="100">
    <circle cx="50" cy="50" r="20" />
  </svg>

</body>
</html>

IE (11) gives me a warning "HTML1500: Tag cannot be self-closing. Use an explicit closing tag." (DevTools, Console tab).

It's true that if I change the <circle.. to:

<circle cx="50" cy="50" r="20"></circle>

the warning goes away, but that looks strange to me..

The IE devtools have occasionally found real unclosed-tag errors, so it would be sad to see it render un-useful from this kind of noise..

Is there any way of making IE happy without resorting to adding closing tags everywhere?

Update: Note that the question is about "Foreign elements", not "Void elements" (http://www.w3.org/html/wg/drafts/html/master/single-page.html#elements-2). <svg> is not self-closing (it's defined as belonging to the Container element category: http://www.w3.org/TR/SVG/struct.html#SVGElement).

<circle.. is defined as a Basic shape element (http://www.w3.org/TR/SVG/shapes.html#CircleElement), which means that it is self-closing. In reading 8.1.2 of the html5 spec:

Foreign elements whose start tag is marked as self-closing can't have any contents (since, again, as there's no end tag, no content can be put between the start tag and the end tag). Foreign elements whose start tag is not marked as self-closing can have text, character references, CDATA sections, other elements, and comments, but the text must not contain the character U+003C LESS-THAN SIGN (<) or an ambiguous ampersand.

it seems (to me) like it is saying that tags inside an <svg> element (i.e. foreign elements) are self-closing if the svg-spec says they are, and when defining start tags (8.1.2.1), #6 says that the / in <tagname ... /> is optional on e.g. <br/>, but not on <circle ../>:

Then, if the element is one of the void elements, or if the element is a foreign element, then there may be a single U+002F SOLIDUS character (/). This character has no effect on void elements, but on foreign elements it marks the start tag as self-closing.

So I believe the document is conforming as-is. I'm unsure if the using a closing </circle> tag would be conforming.

回答1:

See this question: Are (non-void) self-closing tags valid in HTML5?

Basically, HTML5 doesn't really do self-closing tags. Instead it has void tags, like <br>. This also explains why <script> isn't self closing when you are using an external js file; <script> isn't a void element. The SVG you are writing is actually html, so it has to follow HTML5's rules, not XML's.

I think you should just add a closing tag so that you can get the benefits of more important warning/errors in the console. Alternatively if your page was XHTML, I believe you could use a self closing circle tag.

回答2:

A lot of svg-elements can arguably be self-closing. However, these same elements (including basic shapes) often support animation elements, like <animate>, or descriptive elements, like <desc> elements, as content. Since none of the svg-elements are actually void-elements, it is better to use explicit closing tags. It seems to me that IE expects them to be written as such during the initial parsing.

After the initial parsing, IE will not throw warnings for self-closing tags anymore. Neither for an AJAX-request or for inline parsing with javascript.

This will not make IE throw warnings:

// Through an AJAX-request:
var xhr = new XMLHttpRequest;
xhr.open('some-svg.svg');
xhr.responseType = 'document';
xhr.send();

// Inline parsing:
document.body.innerHTML += '<svg width="100" height="100">\
    <circle cx="50" cy="50" r="20" />\
</svg>';

So, for your question: I don't think you can make IE 'happy' without changing those tags. At least not during the initial parsing.

EDITS:

Removed incorrect segments of the answer (xmlns will indeed do nothing in HTML, as the OP stated).
Added a script which will not make IE throw warnings, even with self-closing tags.

NOTES:

I know the question is not about javascript, I've merely added this part to show that IE only throws errors during parsing.
The OP correctly stated that svg (and mathML) elements are defined as foreign elements, this holds true even for IE.