求助：JavaScript实现Cookie完整复制功能失败问题

• input是单行输入控件，不适合存放多行、大段文本，浏览器会自动截断特殊字符或换行
• 你在input的value里用了模板字符串（反引号），但HTML属性不支持这种语法，导致内容解析出错，只保留了开头部分
• 原始Cookie里的换行和嵌套引号也干扰了HTML的属性解析

把input换成textarea，并优化复制逻辑，以下是修改后的完整代码：

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="footer.css" />
<title>Javascript - Copy to Clipboard</title>
</head>
<body>
  <textarea
    name="texto"
    id="texto"
    readonly
    placeholder="Cookie内容"
    rows="15"
    cols="80"
  >
[
    {
        "domain": "teste.pro",
        "hostOnly": true,
        "httpOnly": false,
        "name": "wordpress_test_cookie",
        "path": "/",
        "sameSite": null,
        "secure": false,
        "session": true,
        "storeId": null,
        "value": "WP%20Cookie%20check"
    },
    {
        "domain": "teste.pro",
        "expirationDate": 1708729370.70298,
        "hostOnly": true,
        "httpOnly": false,
        "name": "wp-settings-time-1",
        "path": "/",
        "sameSite": null,
        "secure": true,
        "session": false,
        "storeId": null,
        "value": "1677193564"
    }
]
  </textarea>
  <button onclick="copiarTexto()">Copiar</button>

  <script>
    function copiarTexto() {
      const textoCopiado = document.getElementById("texto");
      textoCopiado.select();
      // 用现代API复制，更稳定
      navigator.clipboard.writeText(textoCopiado.value)
        .then(() => alert("Cookie内容已复制！"))
        .catch(err => {
          console.error("复制失败:", err);
          alert("复制失败，请手动复制");
        });
    }
  </script>

  <div class="footer" id="footer"></div>
  <script src="footer.js"></script>
</body>
</html>

• 替换input为textarea：天生支持多行文本，不会截断换行和长内容
• 去掉了错误的模板字符串和多余引号：直接把Cookie内容放在textarea标签内部，无需额外转义换行
• 改用navigator.clipboard.writeText：这是浏览器官方推荐的复制API，比旧的execCommand更可靠
• 给textarea设置rows和cols：控制显示区域大小，让用户能直观看到完整的Cookie内容

内容的提问来源于stack exchange，提问作者denverfix