Javascript - 我可以在HTML中显示cookie的值吗?

Javascript - Can I display the value of a cookie in HTML?

本文关键字：cookie 显示 我可以 HTML Javascript      更新时间：2023-09-26

我有一个引导网站，我使用插件JS-cookie将用户信息存储在cookie中。

我可以使用经典的 JS/Jquery 在 HTML 中显示 cookie 的值，还是必须使用 Angular 这样的框架？

编辑：

我使用 js-cookie https://github.com/js-cookie/js-cookie

所以我的代码是，在头页： 

         <script>Cookies.set('money', '200', { expires: 7 });</script>

而在体内： 

       <p> You have  <script>Cookies.get('money')</script> dollars </p>

您不只是在 HTML 中间插入脚本来获取函数的结果。脚本必须执行操作才能将值放入 DOM 中。

<p You have <span id="amount"></span> dollars </p>
<script>
var amount = Cookies.get('money');
document.getElementById('amount').textContent = amount;
</script>

在原生 JavaScript 中，您可以执行以下操作。注意：由于安全限制，这似乎不适用于 Stackoverflow，但它似乎在 CodePen 中确实有效。

var arr = document.cookie.split(';'),
    cookies = {};
for(var i=0; i < arr.length; i++){
  var parts = arr[i].split('=');
  if(parts.length !== 2) continue;
  cookies[parts[0].trim()] = parts[1];
}
console.dir(cookies)
document.getElementById('out').textContent = cookies['myCookieKey'];
<div id="out"></div>

更新

使用 JS-Cookie 代码：

<p>You have <span id="amount"></span> dollars</p>
<script>
document.getElementById('amount').textContent = Cookies.get('money');
</script>
相关文章：