JSON.STRINGIFY,使用 HTML 演示

以下是一組不同的示例代碼,使用 HTML 演示 JSON.stringify() 方法的用法:


JSON.STRINGIFY,使用 HTML 演示

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSON.stringify() 方法示例</title>
</head>
<body>
<h1>JSON.stringify() 方法示例</h1>
<p>請在瀏覽器的控制臺中查看結果。</p>
<script>
// 定義一個 JavaScript 對象
let person = {
name: '張三',
age: 26,
company: {
name: 'ABC公司',
address: '北京市'
},
hobbies: ['遊泳', '旅遊'],
isMarried: false
};
// 使用 JSON.stringify() 方法將 JavaScript 對象轉換為 JSON 字符串
let json = JSON.stringify(person);
// 輸出轉換後的 JSON 字符串
console.log(json);
</script>
</body>
</html>


這段代碼定義了一個名為 `person` 的 JavaScript 對象,該對象包含了姓名、年齡、所在公司、愛好和婚姻狀況等屬性。接著使用 `JSON.stringify()` 方法將該對象轉換為 JSON 字符串,並使用 `console.log()` 打印到控制臺中。


其中:


- `<script>` 標簽用於在 HTML 頁面中嵌入 JavaScript 代碼。

- `JSON.stringify()` 是將 JavaScript 對象轉換為 JSON 字符串的方法。

- `console.log()` 用於將輸出結果打印到控制臺中以便開發人員查看。

- `<p>` 標簽用於在頁面中插入一段文字,提示用戶在控制臺中查看結果。


註意,在鍵盤按F12打開瀏覽器控制臺,就看到打印出來的元素了。截圖如下圖:

效果圖截圖如下:

標籤: JSON.STRINGIFY
分享給朋友:

“JSON.STRINGIFY,使用 HTML 演示 ” 的相關文章

mark元素的主要功能及在HTML5 中的使用mark元素例子

mark元素的主要功能及在HTML5 中的使用mark元素例子

`<mark>` 元素的主要功能是突出顯示文本中的重要部分或關鍵字。在 HTML5 標準中,`<mark>` 元素用於標記一個文檔或一個段落中需要突出顯示的文本。一旦在 HTML 文件中使用了 `<mark>` 元素,瀏覽器通常會使用黃色背景標記該元素的文本,在頁…

mark元素使用紅色代表及例子

mark元素使用紅色代表及例子

在HTML中,<mark> 元素可以用於標記或強調文本中的重要或關鍵內容。這個元素通常會用醒目的紅色來渲染,因為紅色是一個視覺上非常具有註意力的顏色。在這種情況下,你可以將這些關鍵字用 <mark> 標簽包圍起來,使其突出顯示。這樣可以幫助用戶更快速地發現這個型號是這個品牌的…

mark點怎麼設置及設置例子

mark點怎麼設置及設置例子

mark 元素用於標記或高亮文本,非常適合用於文本搜索和結果導航。要在文本中使用 mark 元素,只需要將需要高亮的文本放在 mark 元素內即可。通常情況下,瀏覽器默認為高亮文本設置為黃色。 .highlight {    background-color: lightblue…

HTML 和 CSS 實現網頁導航欄和下拉菜單

HTML 和 CSS 實現網頁導航欄和下拉菜單

以下是一組基於 HTML 和 CSS 實現網頁導航欄和下拉菜單的完整代碼:HTML 代碼:CSS 代碼。該代碼實現了一個簡單的網頁導航欄和下拉菜單,其中 `nav` 表示導航欄,`ul` 表示菜單,`li` 表示菜單項,`a` 表示鏈接。通過設置 CSS 樣式,將菜單項設置為了懸停時出現下拉菜單,同…

一個簡單的html結婚特效的代碼

一個簡單的html結婚特效的代碼

以下是一個簡單的html結婚特效的代碼:1. 使用html和css定義了一個結婚的基本樣式;2. 分別定義新娘和新郎,並使用background-image設置其背景圖;3. 定義一個心形圖案,並使用animation讓其跳動。…

星空特效的HTML代碼示例

星空特效的HTML代碼示例

以下是一個星空特效的HTML代碼示例:這個代碼會在頁面背景中生成100個閃爍的星星,使得整個頁面看起來像是夜空中的星空。可以在瀏覽器中運行查看效果。這些代碼可以在瀏覽器中運行並產生相應的星空特效。…