Необходим ли CDATA при стилизации встроенного SVG?
Я читал смешанные вещи об этом, поэтому я надеюсь окончательно разобраться.
Если у меня есть разметка SVG, встроенная в документ HTML, и я оформляю ее с помощью CSS, нужно ли мне заключать этот CSS в закомментированный CDATA?
Пример:
<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8">
</head>
<body>
<svg xmlns = "http://www.w3.org/2000/svg" xmlns:xlink = "http://www.w3.org/1999/xlink" viewBox = "0 0 512 512">
<style type = "text/css">
/* <![CDATA[ */
.some_styles {}
/* ]]> */
</style>
<!-- SVG content here -->
</svg>
</body>
</html>
Я предполагаю, что могут быть такие проблемы, как Дочерний комбинатор CSS, неправильно интерпретируемый как закрывающая скобка XML, и я читал различные сообщения от людей, которые советуют использовать закомментированные CDATA для встроенных стилей SVG 12. Однако, к моему удивлению, я обнаружил, что даже при удалении CDATA и использовании дочернего комбинатора мой HTML-код прошел проверку. Вдобавок к этому мне не удалось обнаружить каких-либо проблем с рендерингом SVG ни в одном современном браузере.
Вот то, что обсуждалось в SE о включении CDATA в тег <script>, но это не то же самое, что <svg>, поэтому казалось, что это оправдывает отдельный вопрос.
Я не против включить его, и это не вызывает никаких проблем. Мне просто интересно, правильно ли я поступаю или что-то ненужное.
@Кайидо Спасибо. Это звучит очень близко к тому, что я могу принять в качестве ответа. Если вы можете дать ссылку на несколько источников и сделать его немного более полным, я с радостью приму это.
@Kaiido Кстати, чтение ответов на вопрос, который вы предложили, может быть дубликатом, не дало мне информацию, которую я искал; но ваше объяснение помогло. Я думаю, что другим, кто ищет, также было бы полезно, если бы на этот вопрос был официально дан ответ. Наконец, я хотел бы уточнить: является ли автономный SVG с внутренний CSS единственным случаем, когда SVG требует CDATA?
Вам определенно нужны оболочки CDATA для внутреннего javaScript (или, скорее, ecmascript, как SVG требует, чтобы он назывался). В противном случае вы не сможете использовать зарезервированные символы XML, такие как < и &, в своем коде js.
Я понятия не имею, почему этот вопрос был помечен как дубликат. Прямо и косвенно связанные предполагаемые оригиналы ссылаются на вопросы о CDATA и <script>, а не на то, в чем здесь вопрос.
В HTML как <script>, так и <style> имеют свое содержимое, определенное как CDATA, поэтому с HTML-страницы вам не о чем беспокоиться. Также обратите внимание, что вы можете даже переместить этот стиль из вашего svg и поместить его в голову, чтобы избежать появления нестилизованного контента и неожиданных утечек. (<style> в <svg> внутри HTML-документа применяется ко всему документу.)