DOM（Document Object Model）是網頁編程中非常重要的概念，它是用來表示網頁文檔的樹形結構，可以通過DOM API來操作和訪問網頁中的元素。而JSON（JavaScript Object Notation）是一種輕量級的數據交換格式，也常被用來表示和傳輸數據。

{
"name": "張三",
"age": 22,
"address": {
"city": "北京",
"street": "中關村"
},
"hobbies": ["籃球", "游戲"]
}

在前端開發中，經常需要將DOM轉換成JSON格式，或者將JSON格式的數據插入到DOM中。其中，有一個重要的API就是JSON.stringify()方法，可以將JavaScript對象轉換為JSON字符串。

const person = {
name: '張三',
age: 22,
address: {
city: '北京',
street: '中關村'
},
hobbies: ['籃球', '游戲']
};
const personJson = JSON.stringify(person);
console.log(personJson);
// 輸出：{"name":"張三","age":22,"address":{"city":"北京","street":"中關村"},"hobbies":["籃球","游戲"]}

同樣地，我們也可以通過JSON.parse()方法將JSON字符串轉換為JavaScript對象。

const personJson = '{"name":"張三","age":22,"address":{"city":"北京","street":"中關村"},"hobbies":["籃球","游戲"]}';
const person = JSON.parse(personJson);
console.log(person);
// 輸出：{ name: '張三', age: 22, address: { city: '北京', street: '中關村' }, hobbies: [ '籃球', '游戲' ] }

通過DOM和JSON的相互轉換，我們可以更方便地操作和訪問網頁中的數據。