Как избежать тега HTML1500 не может быть самозакрывающимся предупреждением в IE при использовании встроенного svg?

Используя то, что я считаю довольно стандартным встроенным 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) дает мне предупреждение "HTML1500: тег не может быть самозакрывающимся. Используйте явный закрывающий тег". (Вкладка DevTools, Console).

Верно, что если я изменил значение <circle.. на:

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

предупреждение уходит, но это выглядит странно для меня..

IE devtools иногда обнаруживают реальные ошибки незакрытых тегов, поэтому было бы грустно видеть, что это делает ненужным этот шум.

Есть ли способ сделать IE счастливым, не прибегая к добавлению закрывающих тегов?

Обновление: Обратите внимание, что вопрос касается "Внешние элементы", а не "Элементы Void" (http://www.w3.org/html/wg/drafts/html/master/single-page.html#elements-2). <svg> не является самозакрывающимся (он определен как принадлежащий к категории элементов контейнера: http://www.w3.org/TR/SVG/struct.html#SVGElement).

<circle.. определяется как элемент базовой формы (http://www.w3.org/TR/SVG/shapes.html#CircleElement), что означает, что он самозакрывается. При чтении 8.1.2 спецификации html5:

Внешние элементы, начальный тег которых отмечен как самозакрывающиеся, не могут иметь любое содержимое (поскольку, опять же, поскольку нет конечного тега, ни один контент не может быть между стартовым тегом и конечным тегом). Иностранные элементы, чьи начальный тег не помечен как самозакрывающийся, может иметь текст, символ ссылки, разделы CDATA, другие элементы и комментарии, но текст не должен содержать символ U + 003C LESS-THAN SIGN (<) или неоднозначный амперсанд.

мне кажется (как мне кажется), что теги внутри элемента <svg> (т.е. внешние элементы) являются самозакрывающимися, если svg-spec говорит, что они есть, а при определении начальных тегов (8.1.2.1) # 6 говорит, что / в <tagname ... /> является необязательным, например, <br/>, но не на <circle ../>:

Затем, если элемент является одним из элементов void или если элемент внешний элемент, то может быть один символ U + 002F SOLIDUS (/). Этот персонаж не влияет на элементы пустоты, но на чужие элементы маркируют начальный тег как самозакрывающийся.

Поэтому я считаю, что документ соответствует как есть. Я не уверен, что использование закрывающего тега </circle> будет соответствовать.

Ответ 1

Смотрите этот вопрос: Являются ли (не void) самозакрывающиеся теги действительными в HTML5?

В принципе, HTML5 действительно не делает самозакрывающиеся теги. Вместо этого он имеет теги void, например <br>. Это также объясняет, почему <script> не закрывается сам, когда вы используете внешний файл js; <script> не является элементом void. SVG, который вы пишете, на самом деле html, поэтому он должен следовать правилам HTML5, а не XML.

Я думаю, вам следует просто добавить закрывающий тег, чтобы вы могли получить преимущества более важных предупреждений/ошибок в консоли. Альтернативно, если ваша страница была XHTML, я считаю, что вы можете использовать тег закрывающего круга.

Ответ 2

Я создал простой python script, чтобы заменить самозакрывающиеся теги обычными тегами.

import re, sys
buf = open(sys.argv[1], 'rb').read()
out = re.sub(r'<([a-zA-Z:]+)([^/>]*)/>', r'<\1\2></\1>', buf)
open(sys.argv[1] + '.out', 'wb').write(out)

Он работает для большинства тегов (не работает, если тег содержит косую черту).