網頁顯示 json 行數
时间: 2023-09-23 17:06:11 浏览: 27
要在网页上显示 JSON 数据的行数,您可以使用 JavaScript 来计算 JSON 字符串中的行数。以下是一个示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<title>显示 JSON 行数</title>
</head>
<body>
<div id="jsonDisplay"></div>
<div id="lineCount"></div>
<script>
// 假设您有一个 JSON 字符串
var jsonString = '{"name": "John", "age": 30, "city": "New York"}';
// 计算 JSON 字符串的行数
var lineCount = jsonString.split(/\r\n|\r|\n/).length;
// 将 JSON 字符串显示在页面上
document.getElementById('jsonDisplay').innerText = jsonString;
// 显示行数
document.getElementById('lineCount').innerText = '行数:' + lineCount;
</script>
</body>
</html>
```
在上面的示例中,我们使用 `split()` 方法将 JSON 字符串按行分割成字符串数组,并使用正则表达式 `/r/n|/r|/n` 来匹配不同的换行符。然后,我们使用数组的 `length` 属性来获取行数,并将其显示在页面上的 `<div>` 元素中。
请注意,上面的示例仅用于演示目的。在实际应用中,您需要根据实际情况获取 JSON 数据,并在页面加载时动态地计算并显示行数。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)