代码之家 › 专栏 › 技术社区 › djcamo

json文件中的换行符问题

json javascript

djcamo · 技术社区 · 8 年前

我从一个系统中导出数据并获取这段内容,如何删除换行符,使其成为一行。

我尝试过各种方法,比如 jsonData.replace(/[\r\n]+/g, '\n\n'); “,但似乎什么都不管用。

{"pageUrl":"/about","name":"About Us","content":"\n    \n        \n        
\n    
About
\n        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\n        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\n    \n"}

这是完整的代码,上面只是json文件中的一项

function list_pages(){
    var access_token = BCAPI.Helper.Site.getAccessToken();
    var request = $.ajax({
        url: "/webresources/api/v3/sites/current/pages?fields=pageUrl,name,content",
        type: "GET",
        connection: "keep-alive",
        contentType: "application/json",
        headers: {
            "Authorization": $.cookie('access_token')
        }
    });
    request.done(function (msg) {
        var myJSONString = JSON.stringify(msg.items);
        **var myEscapedJSONString = myJSONString.replace(/[\r\n]/g, '');**
        $( "#results" ).append( myEscapedJSONString );
    })
    request.fail(function (jqXHR) {
        console.log("Request failed.");
        console.log("Error code: " + jqXHR.status);
        console.log("Error text: " + jqXHR.statusText);
        console.log("Response text: " + jqXHR.responseText);
    })
   }

1 回复 | 直到 8 年前

T.J. Crowder 8 年前

最新答案 :

你对问题的编辑完全改变了它。你在做一件事 replace 关于 JSON.stringify ,这将从不生成问题中的JSON(字符串中包含实际的回车符和/或换行符)。

在一篇评论中,您说您的目标是查看格式化的JSON数据。为此:

告诉 JSON。严格化 通过添加 null, n 打电话去哪里 n 就是你想要多少东西缩进。例如: JSON.stringify(msg.items, null, 4) .
代替 & 具有 & 和 < 具有 < (按顺序)。
输出到元素,其中一个 pre 它的设置 white-space CSS设置(a) 之前 元素,但也可以使用CSS来实现)

所以:

var htmlToDisplay = jsonData
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;");

...然后把它放在一个元素中 white-space: pre .

例子:

var msg = {
  items: [
    {
      pageUrl: "/about",
      name: "About Us",
      content: "\n    \n        \n        \n    About\n        Lorem ipsum dolor sit amet, consectetur adipisicing elit..."
    }
  ]
};
var jsonData = JSON.stringify(msg.items, null, 4);
var htmlToDisplay = jsonData
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;");
$("#results").append(htmlToDisplay);

#results {
  white-space: pre;
  font-family: monospace;
}

<div id="results"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

还有其他的设置 空白 你可以试试,比如 pre-wrap :

var msg={
项目:[
{
pageUrl:“/about”,
姓名:“关于我们”,
内容:“\n\n\n关于\n Lorem ipsum dolor sit amet,Concertetur Adipising Elite…”
}
]
};
var jsonData=JSON。stringify(msg.items,null,4);
var htmlToDisplay=jsonData
.替换(/&/g,“&amp;”)
.替换(/</g,“<”);
$(“#结果”)。附加(htmlToDisplay);

#results {
  white-space: pre-wrap;
  font-family: monospace;
}

<div id=“结果”></部门>
<脚本src=”https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js“></script>

原始答案 :

你不想用换行符替换那些无效的换行符;你想什么都不替换它们:

jsonData = jsonData.replace(/[\r\n]/g, '');

let jsonData = document.getElementById("the-json").textContent;
jsonData = jsonData.replace(/[\r\n]/g, '');
console.log(JSON.parse(jsonData));

<script id="the-json" type="text/json">{"pageUrl":"/about","name":"About Us","content":"\n    \n        \n        
\n    
About
\n        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\n        
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
\n    \n"}</script>