Question

有没有办法通过属性传递数组或对象？像：

<div id="myelem" myattr="{ title: 'hello', author: 'mike'}, { title: 'world', author: 'hellen'}, {...}"/>

我刚尝试使用javascript，但只返回第一个对象，我希望有这样的东西：

for(let i=0; i<this.myattr.length; i++){
  console.log(this.myattr.title);
}

有什么想法吗？三江源

Answer 1

您必须*使用JSON.parse()，并且您的字符串必须采用有效的JSON格式。

＆＃13;

var element = document.getElementById('myelem')
var attributeContent = element.getAttribute('data-myattr')
var object = JSON.parse(attributeContent)

＆＃13;

<div id="myelem" data-myattr='[{ "title": "hello", "author": "mike" }, { "title": "world", "author": "hellen" }]' />

＆＃13;

*您也可以在不需要JSON-String的情况下执行var object = eval(attributeContent)。但请查看＆＃34; Why is using the JavaScript eval function a bad idea?＆＃34;

最后，我建议您使用<script>标记而不是属性通过HTML代码传递JavaScript对象：

<script>
    var myStuff = [{ title: 'hello', author: 'mike' }, { title: 'world', author: 'hellen' }, {}];
</script>

然后，您就可以在JavaScript代码中访问myStuff

Answer 2

从此

<div id="myelem" myattr="[{ title: 'hello', author: 'mike'}, { title: 'world', author: 'hellen'}, {...}]"/>

获取属性值

<强> 1。的Javascript

var attr = document.getElementById('myelem').getAttribute('myattr')

<强> 2。 JQuery的

var attr = $('.myelem').attr('myelem')

字符串到JSON

var obj = JSON.parse(attr)

Answer 3

当你标记你的问题聚合物时 - 这适用于Polymer-elements：

<polymer-element object-attribute='{"alt":"json", "q":"chrome"}'>

来源：https://elements.polymer-project.org/elements/iron-ajax

尝试使用自定义元素，它也运行良好 - 不幸的是它不适用于默认的html元素（例如div）。因此，为此定义一个自定义元素可能是一个解决方案。否则使用上面的答案;）

通过属性传递属性/对象。使用Javascript

3 个答案: