当包裹在 CDATA 标签中时，我的 SVG 文件中的 Javascript 无法运行

Answer 1

我的猜测是您的脚本抛出错误，因为 jQuery 在您尝试运行它的环境中不可用。

如果 jQuery 不可用，此行将抛出错误：

$('svg').append('<style type="text/css">svg{background:blue}

如果 jQuery 可用，您的示例无需修改即可工作：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<?xml version="1.0" encoding="utf-8"?>
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" viewBox="0 0 1435 1084">
<style type="text/css">
    svg{background:red}
</style>
<script type="text/javascript">//<![CDATA[
    const x=1;
    const y=1;

    if (x===y){
        $('svg').append('<style type="text/css">svg{background:blue}</style>');
    }else{}
//]]></script>
</svg>

你不需要 jQuery 来做你想做的事。你可以用内置的浏览器 API 做同样的事情：

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" viewBox="0 0 1435 1084">
<style type="text/css">
    svg{background:red}
</style>
<script type="text/javascript">//<![CDATA[
    const x=1;
    const y=1;

    if (x===y){
        const style = document.createElement('style');
        style.innerText = "svg{background:blue}";
        document.querySelector('svg').append(style);
    }else{}
//]]></script>
</svg>