Question

这可能是一个简单的答案，但我无法弄明白，jQuery doc也无济于事。

我正在附加这样的div：

            $('#container').append(
                $('<p>', {
                    'class': 'myClass',
                    'data-colour': 'green'
                })
            );

所以我得到的是<p class="myClass" data-colour="green"></p>，我怎样才能在追加它时为这个段落添加文字内容？

Answer 1

使用text属性

$('#container').append(
    $('<p />', {
       'class'       : 'myClass',
       'data-colour' : 'green',
       text          : 'Some text'
    })
);

jQuery中可用于集合的任何方法都可以在创建元素时传递的对象中使用

$('<p />', {
    html : '<span>something</span>',
    css  : {
         color    : 'red',
         fontSize : '15px'
    },
    on   : {
        click : function() {
            alert('clicked');
        },
        mouseenter : function() {

        }
    }
})

Answer 2

编辑正如其他人所指出的那样，您可以在创建段落时内联指定文本。如果您需要稍后（多次）更新文本的能力，您可以这样做：

// Store a reference to your new paragraph
var p = $('<p>', {
  'class': 'myClass',
  'data-colour': 'green'
});

// Treat it like you would treat any other jQuery-wrapped element
p.text("Your text goes here...");

// Append it like before
$('#container').append(p);

附加带有参数和内容的段落

2 个答案: