如何使用 NextJS 将自定义属性添加到“DOCTYPE”标签？

Question

与我合作的第三方的要求之一是我需要在页面顶部添加以下内容：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

这是取自这里。

我显然看过 NextJS文档，但找不到更改此标签的方法。

这就是我的自定义_document.ts现在的样子。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta property . . .
    . . .

有可能改变吗？

页面加载怎么样？ 做document.getElementsByTagName('!DOCTYPE html')显然不会起作用，所以我不太确定在这里做什么。

Answer 1

您不能只使用 dangerouslySetInnerHTML，因为不可能将 <.DOCTYPE> 和根标签插入到其他标签中。 为了能够做这样的事情，有必要创建一个 iframe 标签并将 HTML 作为字符串传递到 srcDoc 参数中：就像那样：

  const myhtml =
"<!DOCTYPE html><html lang='en'><head><meta charset='UTF-8'><meta http-equiv='X-UA-Compatible' content='IE=edge'><meta name='viewport' content='width=device-width, initial-scale=1.0'><title>Document</title></head><body><h1>Teste</h1></body></html>"; 

return (
   <iframe srcDoc={myhtml}></iframe>
);

如何使用 NextJS 将自定义属性添加到“DOCTYPE”标签？

问题描述

1 个解决方案

解决方案1
0 2022-12-06 15:36:45

如何使用 NextJS 将自定义属性添加到“DOCTYPE”标签？

问题描述

1 个解决方案

解决方案1 0 2022-12-06 15:36:45

解决方案1
0 2022-12-06 15:36:45