Необходимы ли параметры SVG, такие как "xmlns" и "version"?

примерно в половине примеров svg, которые я вижу в интернете, код завернут в простой простой <svg></svg> теги.

в другой половине теги svg имеют множество сложных атрибутов, таких как:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink">

мой вопрос: Можно ли использовать простые теги svg? Я пробовал играть со сложными, и все отлично работает на моем конце, если я не включаю их.

3 127
svg xml tags

3 ответа:

все пользовательские агенты (браузеры) игнорируют атрибут version, поэтому вы всегда можете его удалить.

Если вы вставляете свой SVG inline в HTML-страницу и служите этой странице как text/html затем атрибуты xmlns не требуется. Встраивание SVG inline в HTML-документы-это довольно недавнее нововведение, которое появилось в рамках HTML5.

Если, однако, вы обслуживаете свою страницу как image / svg + xml или application / xhtml + xml или любой другой тип MIME, который заставляет пользовательский агент использовать Парсер XML, то атрибуты xmlns are требуются. Это был единственный способ сделать вещи до недавнего времени, так что есть много контента служил, как это.

135

The - Это:

  • требуются на image / svg+xml файлы. 1
  • дополнительно на встроенный<svg>. 2

The - это:

  • требуются на image / svg+xml файлы xlink: атрибуты. 1
  • дополнительно на встроенный<svg> С xlink: атрибуты. 2

The - это:

  • рекомендовано в соответствии с image / svg+xml файлы стандартов. 3
  • по-видимому, проигнорировали каждым агентом пользователя. 4
  • удалены в SVG 2. 5

1Интернационализированные идентификаторы ресурсов (RFC3987)
2 начиная с HTML5
3Extensible Markup Language (XML) 1.0
4 скорее всего, до выхода основных версий.
5SVG 2, рекомендация кандидата W3C, 07 августа 2018

147

Я хотел бы добавить к обоим ответам, но у меня нет очков, я добавляю новый ответ. В последних тестах на Chrome (версия 63.0.3239.132 (официальная сборка) (64-разрядная Windows)) я обнаружил, что:

  1. для встроенного SVG, который непосредственно вводится в HTML-файл, через текстовый редактор или javascript и elm.innerHTML, атрибуты xmlns не являются необходимыми, как указано в двух других ответах.
  2. но для встроенного SVG, который загружается через javascript и AJAX, есть два опции:
    • использовать xhr.responseText и elm.innerHTML. Это не требует xmlns.
    • использовать xhr.responseXML.documentElement и elm.appendChild() или elm.insertBefore(). Этот метод создания встроенного SVG дает неполные результаты без объявления основного пространства имен SVG, как в xmlns="http://www.w3.org/2000/svg". загружается в HTML, но функции уровня документа, такие как getElementById() не распознаются в элементе . Я предполагаю, что это связано с тем, что он использует синтаксический анализатор XML XMLHttpRequest за пределами ФОРМАТ HTML.
2