Javascript 从字符串中删除图像元素
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11025352/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove image elements from string
提问by MeltingDog
I have a string that contains HTML image elements that is stored in a var.
我有一个字符串，其中包含存储在 var 中的 HTML 图像元素。
I want to remove the image elements from the string.
我想从字符串中删除图像元素。
I have tried: var content = content.replace(/<img.+>/,"");
我试过了： var content = content.replace(/<img.+>/,"");
and: var content = content.find("img").remove();but had no luck.
和：var content = content.find("img").remove();但没有运气。
Can anyone help me out at all?
任何人都可以帮助我吗？
Thanks
谢谢
回答by Matt Coughlin
var content = content.replace(/<img[^>]*>/g,"");
[^>]*means any number of characters other than >. If you use .+instead, if there are multiple tags the replace operation removes them all at once, including any content between them. Operations are greedy by default, meaning they use the largest possible valid match.
[^>]*表示除>. 如果您.+改为使用，如果有多个标签，替换操作会一次性删除它们，包括它们之间的任何内容。默认情况下，操作是贪婪的，这意味着它们使用最大可能的有效匹配。
/gat the end means replace all occurrences (by default, it only removes the first occurrence).
/g最后意味着替换所有出现（默认情况下，它只删除第一个出现）。
回答by Scott Evernden
$('<p>').html(content).find('img').remove().end().html()
回答by powtac
回答by mlunoe
The following Regex should do the trick:
以下正则表达式应该可以解决问题：
var content = content.replace(/<img[^>"']*((("[^"]*")|('[^']*'))[^"'>]*)*>/g,"");
It first matches the <img. Then [^>"']*matches any character except for >, "and 'any number of times. Then (("[^"]*")|('[^']*'))matches two "with any character in between (except "itself, which is this part [^"]*) or the same thing, but with two 'characters.
它首先匹配<img. 然后[^>"']*匹配除>,"和 '任意次数之外的任何字符。然后(("[^"]*")|('[^']*'))匹配两个"之间的任何字符（除了"它自己，这是这个部分[^"]*）或相同的东西，但有两个'字符。
An example of this would be
"asf<>!('"or'akl>"<?'.
这方面的一个例子是
"asf<>!('"or'akl>"<?'。
This is again followed by any character except for >, "and 'any number of times. The Regex concludes when it finds a >outside a set of single or double quotes.
这后面再次跟除了>,之外的任何字符，"并且出现 '任意次数。正则表达式在发现>一组单引号或双引号之外时结束。
This would then account for having >characters inside attribute strings, as pointed out by @Derek 朕會功夫and would therefore match and remove all four image tags in the following test scenario:
这将解释>属性字符串中有字符，正如@Derek 朕会功夫所指出的那样，因此将在以下测试场景中匹配并删除所有四个图像标签：
<img src="blah.png" title=">:(" alt=">:)" /> Some text between <img src="blah.png" title="<img" /> More text between <img /><img src='asdf>' title="sf>">
This is of course inspired by @Matt Coughlin's answer.
这当然受到@Matt Coughlin的回答的启发。
回答by cakidnyc
I'm in IE right now...this worked great, but my tags come out in upper case (after using innerHTML, i think) ... so I added "i" to make it case insensitive. Now Chrome and IE are happy.
我现在在 IE 中……这很好用，但是我的标签以大写形式出现（我认为在使用 innerHTML 之后）……所以我添加了“i”以使其不区分大小写。现在 Chrome 和 IE 很高兴。
var content = content.replace(/<img[^>]*>/gi,"");
回答by PulseJet
To do this without regex or libraries (read jQuery), you could use DOMParser to parse your string, then use plain JS to do any manipulations and re-serialize to get back your string.
要在没有正则表达式或库（阅读 jQuery）的情况下执行此操作，您可以使用 DOMParser 来解析您的字符串，然后使用普通 JS 进行任何操作并重新序列化以取回您的字符串。
回答by senfo
Does this work for you?:
这对你有用吗？：
var content = content.replace(/<img[^>]*>/g, '')
回答by Jason
You could load the text as a DOM element, then use jQuery to find all images and remove them. I generally try to treat XML (html in this case) as XML and not try to parse through the strings.
您可以将文本加载为 DOM 元素，然后使用 jQuery 查找所有图像并删除它们。我通常尝试将 XML（在这种情况下为 html）视为 XML，而不是尝试通过字符串进行解析。
var element = $('<p>My paragraph has images like this <img src="foo"/> and this <img src="bar"/></p>');
element.find('img').remove();
newText = element.html();
console.log(newText);
