javascript - 如何遍历json对象给相同class的div赋值？

问题描述

问 题

拥有同一class名的div"xxx"如何接受一组json的遍历赋值呢？
我想到的是

var kk = document.getElementsByClassName('xx');

for(i=0;i<json.length;i++){

kk[i].val = json[i] }

但是并没赋值？

补充：
要求是给具有同一class名的div进行赋值，这些div并没有处在一个节点上，
json对象如图所示

解决方案

是设置div中的文本节点内容吗？如果是的话，需要添加相应的文本节点textNode并将其作为子节点添加到对应的div中去，举个例子：

html 代码：

    <div class="test"></div>
    <div class="test"></div>
    <div class="test"></div>
    <div class="test"></div>

js代码：

        var jsonArr = [
            {content: '内容1'},
            {content: '内容2'},
            {content: '内容3'},
            {content: '内容4'}
        ];

        var divArr = document.getElementsByClassName('test');

        var jsonLength = jsonArr.length;
        var textNode;
        for (var i = 0; i < jsonLength; i++) {
            textNode = document.createTextNode(jsonArr[i].content);
            divArr[i].append(textNode);
        }

页面结果：

这篇关于javascript - 如何遍历json对象给相同class的div赋值？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！