在JAVASCRIPT中更正HTML语法

Question

My problem is that I don't know the correct syntax for implementing html in a javascript snippet.

I'm using simplecart.js and I would like to add a custom cart column with the color of one item in it, but I'm stuck with this since one hour.

{
    view: function (item, column) {
        "<div id='couleur'>
        <div style='background-color:'"
        return item.get('color')"'></div>
    </div>"
    },
    label: "Couleur"
},

Could anyone help me with this?
Thanks a lot.

Answer 1

You can not have line breaks in a string, you have nested double quotes, snd you have a function call that makes no sense.

view: function (item, column) {
    var str = "<div id='couleur'>" +
              "<div style='background-color:" + item.get('color') + "'></div>" +
              "</div>";
    return str;
}

Most people would use more of a templating type of architecture.

view: function (item, column) {
    var str = "<div id='couleur'><div style='background-color:{color}'></div></div>";
    return str.replace("{color}", item.get('color'));
}