gpt4 book ai didi

javascript - JSON 样式返回 object 对象

转载 作者:行者123 更新时间:2023-11-28 16:30:30 25 4
gpt4 key购买 nike

来自 this StackOverflow answer我发现了 JavaScript 对象表示法 (JSON) 的强大功能。在尝试使用它时,为了更好地掌握它的实用性,我尝试向该元素应用一些额外的属性。我的问题是如何让 JSON 将嵌套节点解析为字符串,而不是对象对象?作为该问题的后续问题,在 JSON 声明中嵌套 CSS 样式的正确语法是什么?

以下确实有效:

'style': "width: 200px; color: #ACE"

有效(返回对象对象)但我希望它有效(是否有一些语法可以实现这一点?)。

'style': [{
'width': '200px'
}]

//https://stackoverflow.com/a/37887133/5076162

var data = 'Lorem Ipsum is simply dummy text of the printing and typesetting industry <grab> First Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.<grab>Second Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.<grab>Third Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.',


// creating a <div> element with the data string
// as its innerHTML:
elem = $('<div />', {
'html': data,
'title': "myClass",
'style': "width: 200px; color: #ACE",
//'style': [{
// 'width': '200px'
//}]
}),

// using find() to retrieve the <grab> elements from
// within the newly-created <div>, and using map()
array = elem.find('grab').map(function() {
// ...to return the trimmed text of each
// found element:
return this.textContent.trim();

// converting the map to an Array:
}).get();

// appending the joined array (joining the array together
// with a comma-white-space sequence) to the <body>:
$('body').append(array.join(', '));
// => First Item, Second Item, Third Item
elem.appendTo($('body'));
console.log(JSON.stringify($('div').attr('style')));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

最佳答案

style 只能处理字符串非字符串值,它将应用toString()。你需要在 jQuery 中使用 css,它也可以处理对象。

根据 jQuery documentation here :

Important: If the second argument is passed, the HTML string in the first argument must represent a simple element with no attributes. As of jQuery 1.4, any event type can be passed in, and the following jQuery methods can be called: val, css, html, text, data, width, height, or offset.

'css':{ 'width': '200px' }

//http://stackoverflow.com/a/37887133/5076162

var data = 'Lorem Ipsum is simply dummy text of the printing and typesetting industry <grab> First Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.<grab>Second Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.<grab>Third Item</grab>Lorem Ipsum is simply dummy text of the printing and typesetting industry.',


// creating a <div> element with the data string
// as its innerHTML:
elem = $('<div />', {
'html': data,
'title': "myClass",
'css': {
'width': '200px',
'color':'#ACE'
}
}),

// using find() to retrieve the <grab> elements from
// within the newly-created <div>, and using map()
array = elem.find('grab').map(function() {
// ...to return the trimmed text of each
// found element:
return this.textContent.trim();

// converting the map to an Array:
}).get();

// appending the joined array (joining the array together
// with a comma-white-space sequence) to the <body>:
$('body').append(array.join(', '));
// => First Item, Second Item, Third Item
elem.appendTo($('body'));
console.log(JSON.stringify($('div').attr('style')));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

关于javascript - JSON 样式返回 object 对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37926064/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com