使用 jQuery 动态创建 HTML 元素时，如何有条件地在 JSON 中包含值？

Question

我正在为 XML 文件中的每个项目创建一个复选框。每个文件的文本是"TRUE" 或"FALSE"，我想为每个"TRUE" 创建一个选中的复选框，为每个"FALSE" 创建一个未选中的复选框。现在我的代码在 if 和 else 中重复，因为我想不出有条件地在该 JSON 中包含已检查参数的方法。有谁知道完成同样事情的更干燥的方法？

d = $(this)
if (d.text() === 'TRUE') {
    $('<input>', {
    className: 'checkbox',
    type: 'checkbox',
    id: d.attr('id'),
    name: d.attr('name'),
    checked: 'checked'
    }).appendTo(td);
}
else {
    $('<input>', {
    className: 'checkbox',
    type: 'checkbox',
    id: d.attr('id'),
    name: d.attr('name')
    }).appendTo(td);
}

Answer 1

你也可以这样做：

var d = $(this);
var options = {
        className: 'checkbox',
        type: 'checkbox',
        id: d.attr('id'),
        name: d.attr('name')
    };
options.checked = d.text() === 'TRUE' ? 'checked' : '';
/* --or if you think this is more readable
 *if (d.text() === 'TRUE') {
 *  options.checked = 'checked';
 *}
*/
$('<input>', options).appendTo(td);

没有规定不能提前构建属性映射的“规则”。 :)

Answer 2

var d = $(this),
    $input = $('<input>', {
        className: 'checkbox',
        type: 'checkbox',
        id: d.attr('id'),
        name: d.attr('name')
    }).appendTo(td);

if(d.text() === 'TRUE') $input.prop('checked', true);