从字符串中删除类

Question

我从输入中获取内容并将其存储在名为＆＃39;内容＆＃39;

的var中

然后我需要操作此var并从任何img标记中删除类。我试过了：

$('img', content).removeClass('c1 c2');

但没有运气。

我哪里错了？

Answer 1

相反，您可以创建一个虚拟div来保存content作为其html，然后您可以删除这些类。喜欢：

var content = '<div><img src="https://cdn0.iconfinder.com/data/icons/free-business-desktop-icons/128/Money.png" class="c1 c2" ></div>';
var vdiv = $('<div>', {
  html: content
}); // <----hold the content

vdiv.find('img').removeClass('c1 c2'); // <--find img and remove the classes

$(document.body).append(vdiv.find('img')); // <----now you can log it out to see.

img{box-shadow:22px 22px 10px #ccc;}
.c1{background:blue;}
.c2{padding:10px; border:solid 10px red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

下面的代码片段是相反的高级代码执行，让您看看是否注释掉removeClass行输出的内容。

var content = '<div><img src="https://cdn0.iconfinder.com/data/icons/free-business-desktop-icons/128/Money.png" class="c1 c2" ></div>';
var vdiv = $('<div>', {
  html: content
}); // <----hold the content

// vdiv.find('img').removeClass('c1 c2'); // <--find img and remove the classes

$(document.body).append(vdiv.find('img')); // <----now you can log it out to see.

img{box-shadow:22px 22px 10px #ccc;}
.c1{background:blue;}
.c2{padding:10px; border:solid 10px red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

我认为这个解决方案可以提供帮助：

// String images tags
var imgs = '<img src="http://placehold.it/320x200" class="c1 c2"/> text ' +
           '<img src="http://placehold.it/320x200" class="c1"/> more text ' +
           '<img src="http://placehold.it/320x200" class="c2"/>';

// Put the string on input
$("input[type=text]").val(imgs);

// Get val of input (its the same that get string of images tags)
var content = $("input[type=text]").val();

// Convert content to jquery object
var $htmlContent = $(content);

// evaluate all img items and remove c1 and c2 class 
$htmlContent.each(function (index) {
  if ($(this).is('img')) $(this).removeClass('c1 c2');
});

// insert content
$htmlContent.insertAfter("input[type=text]");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" value=""/>

Answer 3

这将从内容中创建jQuery对象，在其中查找所有img标记并从每个img标记中删除类：

$(content).find('img').removeClass('c1 c2')