提高长javascript字符串的可读性

Improve readability for long javascript string

本文关键字：可读性字符串 javascript 高长更新时间：2023-09-26

格式化以下内容的更好方法是什么，目前正在运行一次：

$(this).siblings().last().append('<span class="territory"> ' + territory + ' <a href="#;" class="remove-territory delete" data-territory_code="' + territory + '" data-task_id="' + task_id + '">x</a>,</span>')

我个人更喜欢使用jQuery来创建标记和设置属性。

$(this).siblings().last().append($('<span>')
                                  .addClass('territory')
                                  .append(territory)
                                  .append($('<a>')
                                           .attr({ href: '#;', data-territory_code: territory, data-task_id: task_id })
                                           .addClass('remove-territory delete')
                                           .html('x'))
                                  .append(','));

我更喜欢使用数组连接，因为它更容易阅读。

$(this)
    .siblings()
        .last()
            .append([
                '<span class="territory"> ',
                territory,
                ' <a href="#;" class="remove-territory delete" data-territory_code="',
                territory,
                '" data-task_id="',
                task_id,
                '">x</a>,</span>'
            ].join(''))

或者通过使用jQuery:创建元素

var $span = $('<span>')
                .addClass('territory')
                .text(' ' + territory),
    $link = $('<a>')
                .attr({
                    'href': '#',
                    'data-territory_code': territory,
                    'data-task_id': task_id
                })
                .addClass('remove-territory delete')
                .text('x');
$span.append($link).append(',');
$(this)
    .siblings()
        .last()
            .append($span);