将所有<img/>标记替换为img alt文本

时间:2013-08-08 22:15:45

标签: javascript jquery

我知道如何在php中执行此操作,但我需要在javascript / jquery中完成此操作。

我正在尝试以下内容:

$('#NewBox').html( $('#OldBox').html().Replace('/<img(.*)alt="(.*)"\>/g', "$2") );

我认为javascript没有preg_replace,我所知道的是替换方法。使用“g”应该用正则表达式中的第二个参数替换所有实例(是alt)。知道为什么这不起作用吗?

更新: (希望这能更好地理解我想要的东西)

我有一个这样的字符串:

var str = 'This is a string with <img src="./images/logo.png" alt="logo" /> an image'

我想用alt替换该字符串中的所有标签,现在就是:

'This is a string with logo an image'

2 个答案:

答案 0 :(得分:8)

Don't use regular expressions to manipulate HTML。使用DOM。在客户端JavaScript处理时,这会加倍,因为编辑HTML会破坏事件处理程序绑定。

只需获取每个图像,遍历每个图像,然后替换为alt属性的值。

$('img').each(function () {
  $(this).replaceWith(
    $(this).attr('alt')
  );
});

答案 1 :(得分:1)

当您可以安全地使用解析工具时,应该避免使用正则表达式。 jQuery可以为你解析HTML。

var str = 'This is a string with <img src="./images/logo.png" alt="logo" /> an image';
console.log('input: '+str);

// first create an element and add the string as its HTML
var container = $('<div>').html(str);

// then use .replaceWith(function()) to modify the HTML structure
container.find('img').replaceWith(function() { return this.alt; })

// finally get the HTML back as string
var strAlt = container.html();
console.log('output: '+strAlt);

输出:

input: This is a string with <img src="./images/logo.png" alt="logo" /> an image
output: This is a string with logo an image 

请参阅demo fiddle