在jQuery中跳出撇號

我試圖逃避出我的JSON中的一些撇號。我知道這並不理想，但我將數據追加到DOM，稍後在代碼中調用它。目前，只要數據中有'，我就會收到錯誤消息。我試過使用replace和encodeURI，但似乎沒有工作。在jQuery中跳出撇號

我的代碼基本上是這樣的：

var addItem = function (item, target){ 
    var obj = $(item).data('obj'); 
    var obj_string = JSON.stringify(obj); 
    target.append("<div data-obj='" + obj_string + "'> Added </div> 
}

當我檢查時，得到的撇號它打破了元素：

{"publisher":"EA","games":[{"game":"Dragon's"}]}

看起來是這樣的元素檢查：

{"publisher":"EA","games":[{"game":"Dragon" s"}]}

接下來的一切都被破壞了。任何想法我如何逃避它？

我發現很多方法，如果它是純粹的jQuery的，但它在HTML中似乎無法正常工作。

來源

2014-05-20 Hulaz

您必須在JSON中使用反斜槓並移除該反斜槓以用於HTML。 –

爲什麼當你用'.data（）'存儲它時，它會將它拋入HTML屬性中？ –

使用'document.createElement（...）'構建JS方法的元素。：P – techouse

您可以避免轉義和字符串化©使用.data()直接將obj設置爲元素。

$('<div/>').data('obj', obj).text('Added').appendTo(target);

只要記住用這種方法，你不會得到實際元素本身對數據屬性，但該數據將在那裏當你與.data提出要求。

來源

2014-05-20 13:48:15

您可以使用'.data（'obj'，obj）'保持與OP相同的命名，並避免不必要的字符串化/解析對象。 –

我調整了它。不知道我是如何錯過的。 –

沒問題，我已經將關鍵字名稱調整爲'obj'，因爲這是OP在問題中使用的（'data-obj'）。 –

而不是把自己暴露給XSS，嘗試：

var div = document.createElement('div'); 
div.appendChild(document.createTextNode("Added")); 
div.setAttribute("data-obj",obj_string); 
target.append(div);

來源

2014-05-20 13:48:53

您串聯與已使用單引號的字符串內容。級聯的結果很可能是<div data-obj='Dragon's'>這不是你想要的。串聯時

要麼逃避單引號（不知道該實體將不會被解釋）：

.append("<div data-obj='" + obj_string.replace("'", "&#130;") + "'> Added </div>");

或更安全，你可以建立與jQuery你的節點，這將給你一個本地逃避一些性能損失：

.append($("<div>Added</div>").data("obj", obj_string));

來源

2014-05-20 13:51:46

嗨，我試圖做到這一點你說的第一種方式（最小的變化），但它失敗： 'function ensureObject（obj）{ if（typeof obj！='object'）{ obj = eval（'（'+ obj +'）'）; }; return obj; };' 我得到的錯誤非法令牌 – Hulaz

哦，我看到了，我其實寫了一個錯誤。你不應該用HTML來避免引號，而不要用反斜槓來加前綴。你應該使用第二個更安全，因爲第一個不處理任何可能會破壞HTML的字符。 –

在jQuery中跳出撇號

回答

相關問題