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

时间:2016-02-08 23:31:19

标签: javascript jquery cookies js-cookie

我有一个bootstrap网站,我使用插件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>

2 个答案:

答案 0 :(得分:2)

您不仅可以在HTML中间插入脚本来获取函数的结果。该脚本必须执行操作以将值放入DOM中。

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

答案 1 :(得分:1)

在本机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>