How to display JSON.stringify to HTML as values-CodePudding

I have tried to fetch data using json, and it worked as I wanted to. But the problem is how can I display it on my page or HTML? what I am getting is [{"name":"Black wall"},{"name":"Green wall"},{"name":"Gray wall"}] so How can I make it formal and just display Black wall, Green wall, Gray wall. Is there a way to do this?

$(function(){
    $(".checkBoxClass").on("click", function() {
        var data = [];
        $("table > tbody > tr").each(function () {
        var $tr = $(this);
        if ($tr.find(".checkBoxClass").is(":checked")) {
            data.push({
            name: $tr.find(".name").text(),
            });
        }
        });
        console.clear();
        var messages = JSON.stringify(data);
        console.log(messages);
    });
});

CodePudding user response：

Basic array map() with join()

var data = [{"name":"Black wall"},{"name":"Green wall"},{"name":"Gray wall"}];

console.log(data.map(function(obj){ return obj.name; }).join(", "));

CodePudding user response：

One of the ways that you can convert results to your format:

const myResult = [{"name":"Black wall"},{"name":"Green wall"},{"name":"Gray wall"}];

const myItems= myResult.map( (item)=> {
    return item.name;
});

console.log(myItems.join(','))

CodePudding user response：

output.innerHTML = messages.propertyName; //I am assuming that messages is your json.stringify object