使用 jquery 在 cookie 中存储和检索 div

Question

好的， 所以我使用 jquery 创建一个 cookie 并在其中存储一个 div。 这个 div 有很多格式、其他 div、文本等。

var rentContainer = document.createElement('div');
rentContainer.setAttribute("class","module");
var carContainer = document.createElement('div');
carContainer.setAttribute("class","carRentContainer");
rentContainer.appendChild(carContainer);
.... and a lot of other things go in this rentContainer div

现在将其保存在 cookie 中，

$.cookie('rented_car', rentContainer);

到目前为止一切看起来都很好。

当刷新页面并加载正文时，现在是时候获取此 div 并将其显示在页面上（具有相同的格式、结构等）。

所以在我的函数中我有

var rented_car_cookie = $.cookie("rented_car");
if(rented_car_cookie){
    document.getElementById('rentit').appendChild(rented_car_cookie);
    //rentit is already defined and exists on the page. All I need is to add the cookie div content on it.

，但这给了我一条错误消息

已达到 Firebug 的日志限制。 0 个条目未显示。偏好设置
未捕获的异常：[异常...“无法转换 JavaScript 参数 arg 0 [nsIDOMHTMLDivElement.appendChild]” nsresult：“0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)”位置：“JS 框架 :: iGo.js :: checkCookies :: 第 10 行”数据：没有]

请帮忙。最好的方法是什么？

Answer 1

无论如何，将完整的 html 元素存储在 cookie 中是一件坏事。也许使用 JSON 更好。

不管怎样，你可以尝试将 div 保存为 cookie 中的 html 字符串。

// set
$.cookie("rented_car", $(rentContainer).html())

// get
var content = $.cookie("rented_car");
var $rentContainer = $('<div class="module">' + content + '</div>');

代码： http://jsfiddle.net/yecf8/

但是你需要知道，有很多不同的不同浏览器关于 cookie 的限制。例如：

Microsoft Internet Explorer 符合以下 RFC 2109 建议的最低限制：

• 至少 300 个 cookie
• 每个 cookie 至少 4096 字节（根据 Set-Cookie 标头的语法描述中构成 cookie 非终结符的字符大小来衡量）
• 每个唯一主机或域名至少有 20 个 Cookie