javascript - 用 Jquery 替换图像的源

Question

我正在用 Phonegap 构建一个应用程序。它从 rss 提要中获取 xml，并从中创建 html 来呈现新闻提要。问题是图像路径是相对的。我需要用完整路径替换相对路径。图像标签出现在“描述”xml 标签内。我得到这样的描述内容：

$(xml).find('item').each(function (index) {

   description = $(this).find('description').text();
   console.log('description');

控制台输出为：

<p>Senior Rugby</p>
<p>CBC v CBS</p>
<p>
  <span class="mjwideimg"><img width="300" height="247" src="/images/latestnews2/Resized/logo_300x247.jpg" alt="logo" />
  </span>
</p>

然后我尝试用完整路径替换路径。我愿意：

$(description).find('img:first').attr('src', 'http://www.domain.com/img/test.png');

然后获取具有完整路径的新 html：

description = $(description).html();
console.log(description);

但是，这只是输出：

Senior Rugby

其他一切都被剥夺了。我究竟做错了什么？

Answer 1

首先console.log你在做

description = $(this).find('description').text();
console.log('description');

在这里，您记录的是 xml 节点，而不是您编码的变量。

在另一个方面，你做了一些不同的事情（这次你是为变量做的）

description = $(description).html();
console.log(description);

另一点是使用.prop()而不是.attr()

$(description).find('img:first').prop('src', 'http://www.domain.com/img/test.png');

Answer 2

当您找到图像时，描述是否仍设置为$(this).find('description').text();？

如果是这样，则 JQuery 对象不是指向 HTML 元素，而是指向该元素内的文本字符串。

尝试将描述替换为$(this).find('description');

Answer 3

In the end I did this:

description = $(this).find('description').text();

$(description).find('img').each(function(i, obj){

   src = $(obj).attr('src');

   //check if not full path 
   if(src.indexOf('http') === -1){
     //therefore its a relative path
     description = description.replace(src,"http://domain.com"+src);
   }
});