本文讲解如何安全、准确地将数据库返回的 json 格式字符串（含双引号包裹的多个字段）解析为纯文本列表，避免正则误分割、转义错误等问题，并提供原生 javascript 与 jquery 的两种健壮实现方案。
在实际开发中，后端常以 JSON 字符串形式返回结构化数据（如 ["Item A", "Item B", "Item C"]），但若前端错误地将其当作普通字符串处理，直接使用 toString() 和正则替换（如按逗号分割），极易因内容中包含英文逗号、引号或特殊符号而引发解析错误——正如问题中所示：原本应作为单个列表项的 "55" Smart TV, 1x Clear Writing Glass, ..." 被错误拆分为多个碎片。
根本原因在于：你正在用字符串操作“模拟” JSON 解析，而这不是可靠的做法。 正确路径是——信任 JSON 格式，使用标准解析器。
✅ 推荐方案：使用 JSON.parse() 安全解析
假设你从数据库或 API 获取的是如下字符串（注意：这是字符串字面量，不是数组）：
const ajaxPlainResponse = '["Time Usage: 9.00am - 4.00pm", "Rental of Commune Room 01 (7 Hours)", "55\" Smart TV, 1x Clear Writing Glass, Marker Pen, HDMI Cable, Complimentary WiFi, and Filtered Water"]';
只需一行解析即可获得真实数组：
const description = JSON.parse(ajaxPlainResponse); // → ["Time Usage: 9.00am - 4.00pm", "Rental of Commune Room 01 (7 Hours)", "55" Smart TV, 1x Clear Writing Glass, Marker Pen, HDMI Cable, Complimentary WiFi, and Filtered Water"]
随后可轻松生成符合预期的带项目符号的纯文本或 HTML 列表：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
▪ 原生 JavaScript（输出到 元素）
<ul id="feature-list"></ul>
const listEl = document.getElementById('feature-list');
description.forEach(item => {
const li = document.createElement('li');
li.textContent = item; // 自动转义，防止 XSS
listEl.appendChild(li);
});▪ 或生成 Markdown 风格文本（适用于非 HTML 环境）
const markdownList = description.map(item => `- ${item}`).join('
');
console.log(markdownList);
// 输出：
// - Time Usage: 9.00am - 4.00pm
// - Rental of Commune Room 01 (7 Hours)
// - 55" Smart TV, 1x Clear Writing Glass, Marker Pen, HDMI Cable, Complimentary WiFi, and Filtered Water⚠️ 关键注意事项
永远优先 JSON.parse()，而非正则/字符串替换：JSON 是标准格式，其嵌套引号、转义（如 "）、逗号分隔等均由规范定义，正则无法可靠覆盖所有边界情况。
-
确保输入是合法 JSON 字符串：若后端返回未加外层引号（如 [...]）或格式不规范，JSON.parse() 会抛出 SyntaxError。建议配合 try...catch 处理：
try { const data = JSON.parse(ajaxPlainResponse); } catch (e) { console.error('Invalid JSON response:', e.message); // 可降级处理或提示用户 } 警惕 XSS 风险：若将 item 直接插入 HTML（如 innerHTML = item），需先做 HTML 转义；使用 textContent 或现代模板方案（如 document.createTextNode()）更安全。
-
jQuery 用户提示：若使用 $.ajax()，直接设置 dataType: 'json'，jQuery 会自动调用 JSON.parse()，无需手动解析：
$.ajax({ url: '/api/features', dataType: 'json', success(data) { $('#feature-list').empty().append( data.map(text => `<li>${escapeHtml(text)}</li>`).join('') ); } }); function escapeHtml(str) { return str.replace(/[&<>"']/g, c => ({ '&': '&', '<': '<', '>': '>', '"': '"', "'": ''' }[c])); }
通过遵循这一模式，你不仅能精准还原原始语义（保留所有标点、空格与引号），还能显著提升代码健壮性与可维护性——告别“调试正则一整天，不如一行 parse()”的困境。
