Question

我有一段jquery，用括号＆lt;＆gt; 替换括号 {} ：

＆＃xA;＆＃ xA;

JQuery：

＆＃xA;＆＃xA;

  window.onload = function（）{＆＃xA; $（“body”） .children（）。html（function（_，html）{＆＃xA; return html＆＃xA; .replace（/ \ {/ g，“＆lt;”）＆＃xA; .replace（/ b \ @ / g ，“strong”）＆＃xA; .replace（/ \！/ g，“/”）＆＃xA; .replace（/ \} / g，“＆gt;”）;＆＃xA;}）;＆＃ XA;}＆＃XA;

＆＃XA;＆＃XA;   HTML  
＆＃XA;＆＃XA;

 <代码>＆lt;！DOCTYPE HTML＆gt;＆＃xA;＆lt; html＆gt;＆＃xA;＆＃xA;＆lt; head＆gt;＆＃xA;＆lt; script src =“jquery.js”type =“text / javascript”＆gt ;＆lt; / script＆gt;＆＃xA;＆lt; script src =“tags.js”type =“text / javascript”＆gt;＆lt; / script＆gt;＆＃xA;＆lt; meta charset =“utf-8”＆gt; ＆＃XA;＆LT;标题＆GT;东西＆LT; /标题＆GT;＆＃XA;＆LT; /头＆GT;＆＃XA;＆LT;主体＆GT;＆＃XA;＆LT;并且R w;＆＃XA;＆LT;风格＆GT;＆＃XA; .red {＆＃xA; color：red;＆＃xA;}＆＃xA;＆lt; / style＆gt;＆＃xA; {style}＆＃xA; body {＆＃xA; background-color：red;＆＃ xA;}＆＃xA; {！style}＆＃xA;＆＃xA; {b @ class =“red”}＆＃xA; Som e粗体文字＆＃xA; {！b @}＆＃xA;＆＃xA;＆lt; / w＆gt;＆＃xA;＆lt; / body＆gt;＆＃xA;＆lt; / html＆gt;＆＃xA;

＆＃xA;＆＃xA;

但是当我尝试输入 {style} 标签时，样式标签可以正常工作，但实际上并没有渲染CSS。此外，当我尝试将 color：red 应用于 .red {b @} 的普通样式标记时，它不起作用，但如果我应用了样式内联。＆＃xA;

＆＃xA;问题是：有没有办法在样式标记内正确渲染CSS？

＆＃xA;

Answer 1

你非常接近。您只需在代码末尾添加以下行：

$('style').appendTo('head').text(function() {
  return $(this).text().replace(/\</g,'{').replace(/\>/g,'}');
});

这会将style元素移动到head，并撤消先前代码中针对这些元素的文本替换。

<强>段：

window.onload=function() {
  $("body").children().html(function (_, html) {
    return html
    .replace(/\{/g,"<")     
     .replace(/b\@/g,"strong")
.replace(/\!/g,"/")
    .replace(/\}/g,">");
  });

  $('style').appendTo('head').text(function() {
    return $(this).text().replace(/\</g,'{').replace(/\>/g,'}');
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<w>
<style>
.red {
color: red;
}
</style>
{style}
body {
background-color:yellow;
}
{!style}

{b@ class="red"}
Some Bold Text
{!b@}

</w>
</body>

Answer 2

正如@barmar所说，{}覆盖了CSS括号，所以我只是将{}更改为[]，因此它不会干扰。

Answer 3

这是因为<style>标记自您编写{style}后未被浏览器编译，您无法通过替换{{1}来使其生效{}。您需要在脚本执行时替换，然后在jquery中加载所有代码并将其附加到页面

将括号中的文本替换为标记的Javascript，不能与<style>

3 个答案: