javascript - 点击 td 后将图像添加到 td

Question

我有一张表格，一行一行，一个单元格，有一个文本。文本位于 td 的中心。

点击 td 时，我想在文本后添加图像。我不希望文本被移动，而是保留在同一个地方。

这是我的 jsfiddle:

http://jsfiddle.net/alonshmiel/L7qn3/1/

在这个 jsfiddle 中，文本向左移动。

<table>
    <tr>
        <td style="border:1px solid red; width:100px; text-align:center;" onclick="func(this);">
            sfh
        </td>
    </tr>
</table>

谢谢大家!

Answer 1

做到这一点的唯一方法是给文本一个固定的边距而不是居中。这样，当添加新内容时，文本将保持居中。

<td style="border:1px solid red; width:100px;" onclick="func(this);">
    <span style="margin-left:38px;">sfh</span>
</td>

这是例子 JSFiddle