0

我有一个使用 html 服务的简单应用程序脚本，我需要 :after 伪选择器。

将问题归结为一行代码，我有

<style>
test:after {
  content: attr(data-hidden);
  display: inline-block;
  font-weight: bold;
}
</style>

<test data-hidden="Now you don't">Now you see me </test>

每个 jsfiddle，预期的输出将是“现在你看到我现在你没有”，但我只得到“现在你看到我”

如果我按预期删除 :after I get Now you see me。

FWIW 我正在使用 .setSandboxMode(HtmlService.SandboxMode.NATIVE)

谁能告诉我我做错了什么？

4

1 回答 1

1

该content: attr()行正在被 caja 编译器剥离。在Caja Playground上尝试您的代码片段，并检查渲染结果，这应该比您在 jsfiddle 获得的从 Google Apps 脚本服务时如何清理 HTML 更好地表示。

这是渲染的内容：

<caja-v-html>
  <caja-v-head>
    <style>
      .CajaGadget2___ caja-v-test:after{
        display:inline-block;
        font-weight:bold;}
    </style>
  </caja-v-head>
  <caja-v-body>
    <caja-v-test data-caja-data-hidden="Now you don't">Now you see me </caja-v-test>
  </caja-v-body>
</caja-v-html>

标签的data-hidden属性<test>仍然存在，但content样式中没有包含它的属性。这可能是因为该attr()声明似乎是一种攻击媒介。（示例）

如果我们用一个常数再试一次content，它会在哄骗中幸存下来：

<caja-v-html>
  <caja-v-head>
    <style>
      .CajaGadget2___ caja-v-test:after{
        content:"waffles";           <<<<<<
        display:inline-block;
        font-weight:bold;}
    </style>
  </caja-v-head>
  <caja-v-body>
    <caja-v-test data-caja-data-hidden="Now you don't">Now you see me </caja-v-test>
  </caja-v-body>
</caja-v-html>

由于进行了消毒，您将无法以attr()这种方式进行工作。您可以在Caja 问题跟踪器上输入问题。

于 2013-12-19T03:58:32.763 回答