时间戳

首页 > 解决方案 > 如何在 HTML iframe 文档中插入特殊字符？

javascript - 如何在 HTML iframe 文档中插入特殊字符？

问题描述

我正在尝试将 JavaScript 添加到 HTML 沙盒 iframe。JavaScript 代码包含一个奇怪的字符。当代码在 iframe 之外运行时，它可以完美运行。不幸的是，Stack Overflow 无法显示此字符。

<!DOCTYPE html>
    <body>
        <script>
            console.log("Special character: ''")
        </script>
    </body>
</html>

现在我想使用 srcdoc 将此代码插入到沙盒 iframe 中。

<!DOCTYPE html>
    <body>
        <iframe sandbox = "allow-scripts" srcdoc = "<!DOCTYPE html><body><script>console.log(Special character: '')</script></body></html>"></iframe>
    </body>
</html>

当我在 Firefox 网络浏览器中运行上面的代码时，它有时会在控制台中显示字符。在其他时候，它会引发错误：Uncaught SyntaxError: invalid range in character class. 这很奇怪的主要原因是因为每次结果都不一样。这让我想知道这是否是一个 Firefox 错误。请说明原因。

在花了很多时间在这之后，我决定采取另一种方法。

<!DOCTYPE html>
    <body>
        <iframe id = frame sandbox = "allow-scripts allow-same-origin"></iframe>

        <script>
            const content = frame.contentWindow || frame.contentDocument
            content.document.open()
            content.document.write("<!DOCTYPE html><body><script>console.log(Special character: '')<\/script></body></html>")
            content.document.close()
        </script>
    </body>
</html>

这一次，我得到一个不同的错误：missing ) after argument list. 我知道没有括号丢失。导致问题的原因是特殊字符。

最后，我尝试了其他方法。

<!DOCTYPE html>
    <body>
        <iframe id = frame sandbox = "allow-scripts allow-same-origin"></iframe>

        <script>
            const content = frame.contentWindow || frame.contentDocument
            content.document.open()
            content.document.write("<!DOCTYPE html><body></body></html>")
            content.document.close()

            content.eval("console.log(Special character: '')")
        </script>
    </body>
</html>

上面的代码有时有效，有时无效。这非常令人沮丧。上面代码的另一个问题是我必须包含allow-same-origin在 iframe 沙箱中，我希望 iframe 尽可能安全，并且我真的不想给 iframe 太多控制权。

这只是一个 Firefox 错误吗？即使不能在控制台显示这个字符，如何保证不出错呢？

编辑： 堆栈溢出不断从我的帖子中删除角色。这是一个小提琴。

标签： javascripthtmliframesandbox

解决方案

感谢您提供有用的意见。这不是 Firefox 错误。在处理特殊字符时，不能将它们粘贴为纯 HTML。另外，我犯了一个大错误。我正在编写以下代码。

<!DOCTYPE html>
    <body>
        <iframe access = "allow-scripts" srcdoc = "<!DOCTYPE html><body><script>console.log(Special character: '')</script></body></html>"></iframe>
    </body>
</html>

如果你仔细观察，你会发现我错过了console.log函数中的引号。这导致了 JavaScript 错误。JavaScriptcharCodeAt()函数对于获取字符代码很有用，@Old Geezer帮助我理解了这一点。

获得字符代码后，您就可以编写 HTML 代码了。

<!DOCTYPE html>
    <body>
        <iframe access = "allow-scripts" srcdoc = "<!DOCTYPE html><body><script>console.log(&#34;Special character: '&#28;'&#34;)</script></body></html>"></iframe>
    </body>
</html>

上面的代码运行没有任何错误。字符在不同浏览器上显示不同的事实不是问题，因为这个特定字符没有可见的字形。

推荐阅读