table td在动态创建时没有获取其css

Question

var $imageicon = $('<image/>');
 $imageicon.attr('src', '../../Content/images/ReplyIcon.png');
 $imageicon.addClass('replyIcon');
 var $table = $('<table/>').addClass('replyContent');
 $table.attr('id', 'replyArea');

 $table.append(
                         $('<tr>').append($('<td>').append($imageicon).addClass('replyIcontd'), $('<td>').text('hii'))
      );
 $("#container").append(
               $('<div/>')
                  .attr('id', 'replytopost')
                  .append($table)
            );

CSS

.replyIcontd
{
   width:5%;

}

表出现但我想减少hii和图像之间的空间我试图将宽度减小到5％但是我无法做到 我的图像hii是一个td，ok是一个td。我希望它们两个并排来回

Answer 1

我可能认为你的问题是你使用百分比而不是固定宽度。我在自己的计算机上尝试过，这种风格应用于表格数据。

您可以尝试扩展您的CSS：

.replyIcontd
{
   width: 200px;
   background: red;
}

这可能对您有用，然后您只需使用更合适的值200px。重要的是要注意5％的宽度是相对于桌子的宽度。

Answer 2

您忘记在动态创建的元素上关闭/。

 $('<tr />').append($('<td />').append($imageicon).addClass('replyIcontd'), $('<td />').text('hii'));

---

<强>更新 我对你的脚本进行了一些非常大的改动，并采用了正确的方法。

 var $imageicon = $('<img />', {
     'src' : '../../Content/images/ReplyIcon.png',
     'class' : 'replyIcon'
 });

 var $table = $('<table/>', {
     "class" : "replyContent",
     "id" : "replayArea",
     'html' : $('<tr />', {
                 'html' :  $('<td />', {
                     'class': 'replyIcontd',
                     'html' : $imageicon
                 }).html()+$("<td />", {
                     'text' : 'hii'
                 }).html()                     
              })

 });

Demo