javascript - 如何将漂亮的json格式嵌入到html静态页面？

Question

我有这个代码:

 public <T> String toJson(T item)
    {
        String json;
        ObjectWriter ow = new ObjectMapper().writer().withDefaultPrettyPrinter();
        try {
            json = ow.writeValueAsString(item);
        } catch (IOException e) {
            e.printStackTrace();
            json = "";
        }
        return json;
    }

我从服务器端创建一个静态 html 页面(使用 gagawa):

    java.util.Map<String, String> paramsMap = filterInterestingQueryParams(url);

    Li li4 = new Li().appendText("special params: " + jsonParser.toJson(paramsMap));

但我的 html 看起来很糟糕。

您如何将 map 美化为 html？

*有没有办法通过#chars 来限制行内容？*一种保持漂亮打印品的方法？

Answer 1

最简单的方法是在您的页面中添加一些 CSS:

li.wrap {
  word-wrap:break-word;
}

<ul>
<li>Really long special params: {stickToPath=8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,}</li>
<li class="wrap">Really long special params (that wraps): {stickToPath=8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,8484.20202002,-481737.45454,}</li>
</ul>

如您所见，第二个 li与 wrap类在框架边缘换行，而另一个则没有。

---

如果您需要 json 打印得漂亮，您需要修改输出 HTML 并将 json 包装在 <pre> 中标签。默认情况下，这些将保留换行符和空格。