Javascript 将文本内的图像与jQuery水平对齐

我有一个div，其中包含一篇文章。我的意思是，它可能包含文本和图像。大概是这样的：

Blah Blah Blah Blah    Blah Blah Blah Blah    Blah Blah Blah Blah
Blah Blah Blah Blah    Blah Blah Blah Blah    Blah Blah Blah Blah
Blah Blah Blah Blah    Blah Blah Blah Blah.
{IMAGE}
Blah Blah Blah Blah    Blah Blah Blah Blah    Blah Blah Blah Blah
Blah Blah Blah Blah    Blah Blah Blah Blah    Blah Blah Blah Blah.
{IMAGE}
Blah Blah Blah Blah    Blah Blah Blah Blah.

因此，并非每个图像周围都有div

但是我想用jQuery水平对齐图像的中心。我的想法是用一个特定的类围绕每个图像（使用jQuery）创建一个div

但我不知道如何在jQuery中做到这一点

怎么做或还有更好的方法吗

---

编辑：内容从另一个网站的提要下载。我想水平对齐图像中心。

您的html是这样的吗

<div id="container">
    <div id="column1">
        article text article text
        <img />
        article text article text
    </div>
    <div id="column2">
        article text article text
        <img />
        article text article text
    </div>
    <div id="column3">
        article text with no image
        article text with no image
        article text article text
    </div>
</div>

文章正文文章正文
文章正文文章正文
文章正文文章正文
文章正文文章正文
没有图像的文章文本
没有图像的文章文本
文章正文文章正文

您的html是这样的吗

<div id="container">
    <div id="column1">
        article text article text
        <img />
        article text article text
    </div>
    <div id="column2">
        article text article text
        <img />
        article text article text
    </div>
    <div id="column3">
        article text with no image
        article text with no image
        article text article text
    </div>
</div>

文章正文文章正文
文章正文文章正文
文章正文文章正文
文章正文文章正文
没有图像的文章文本
没有图像的文章文本
文章正文文章正文

您可以执行以下操作：

就你而言：

$（'.test'）。追加（$（'#image1'）

在jquery中，还可以使用wrap方法：

---

例如：$（'img'）.wrap（'code>'）

您可以这样做：

就你而言：

$（'.test'）。追加（$（'#image1'）

在jquery中，还可以使用wrap方法：

---

例如：$（'img'）.wrap（'code>'）

不需要在img周围添加div，它只能通过css完成

试试这个

---

只需使用

display:block

和

margin:auto

无需在img周围添加div，这只能通过css完成

试试这个

只需使用

display:block

和

margin:auto

jQuery将所有

标记包装成

：

$('img').wrap('<div class="imageclass" />');

jQuery使用

包装所有

标记：

$('img').wrap('<div class="imageclass" />');

---

---

您是否正在尝试在div中添加类似这样的图像：$div=$（'div'）$div.addClass（“测试”）$第4节附加（“”）；这看起来是这样的：@Aby，html中已经有一个图像标记。我希望jQuery能够检测到它们，并在其前面和后面添加类似于

的内容。+1'ed-因为这是一个公平的问题，人们不合理地知道您试图在div中添加图像，比如：$div=$（'div'）$div.addClass（“测试”）$第4节附加（“”）；这看起来是这样的：@Aby，html中已经有一个图像标记。我希望jQuery能够检测到它们，并在其前面附加类似于

的内容，在其后面附加类似于

的内容。+1'ed-因为这是一个公平的问题，人们都是无理的人，但

可能不存在。我认为除非出现一些疯狂的布局情况，你最好用CSS而不是jqueryYou应该在你的问题中包含一些代码，很难看出你的建议是什么。是的，但是

可能不存在。我认为除非有一些疯狂的布局情况，你最好用CSS而不是jQuery。你应该在问题中包含一些代码，很难看出你的建议。你想“用特定类在每个图像（用jQuery）周围创建一个div。”rite？你想“用特定类在每个图像（用jQuery）周围创建一个div”rite？你的解决方案很简单，而且很有效！多谢各位@MahdiGhiasi：是的，但我的回答完全符合您最初的要求^^您的解决方案非常简单，而且很有效！多谢各位@MahdiGhiasi：是的，但我的回答完全符合您最初的要求^^^谢谢。我已经在JSFIDLE中尝试了你的代码：你的jQuery工作得很好，但是你的css应该是：

.imageclass{text align:center；}

，我想。@MahdiGhiasi

margin:0 auto应在浏览器中工作；JSFIDLE在CSSThank上并不是万无一失的谢谢。我已经在JSFIDLE中尝试了你的代码：你的jQuery工作得很好，但是你的css应该是：
.imageclass{text align:center；}
，我想。@MahdiGhiasi
margin:0 auto应在浏览器中工作；JSFIDLE在CSS上并不是绝对可靠的