Javascript Dom字符串不'；在使用jQuery attr进行操作后不会发生更改

我正在制作一个基于js的epub阅读器作为一个周末项目，我正在尝试将书中每个页面上的图像的src属性从图像URL更改为从epub zip加载的数据URI。以下是我的功能：

//page contents is just an html string of the book's page
pageContents = GlobalZipLoader.load('epub.zip://' + pageLocation);
pageContents = replaceImages(pageContents)

...

function replaceImages(pageContents){
  $(pageContents).find('img').each(function(){
    var domImage = $(this);

    //this is something like ".../Images/img.jpg"
    var imageLocation = domImage.attr('src'); 

    //this returns the proper data-uri representation of the image
    var dataUri = GlobalZipLoader.loadImage('epub.zip://' + imageLocation);

    //this doesn't seem to "stick"
    domImage.attr('src', dataUri);
  });
  return pageContents;
}

replaceImages函数返回的pageContents仍然具有旧的src属性。我可以提供更多的细节，如果需要，但任何帮助将非常感谢

由于系统重启和Ilia G，答案正确：

function replaceImages(pageContents) {
    newContent = $(pageContent);
    ... manip ...
    return newContent;
}

---

图像加载完成后，应尝试更改图像

src

我认为这是在

loadImage

函数中发生的

根据您的更新问题：

---

我想你不需要任何

clone（）

。只需将

pageContents

存储在

tempContents

变量中，并使用该变量

您应该在图像加载完成后尝试更改图像

src

我认为这是在

loadImage

函数中发生的

根据您的更新问题：

---

我想你不需要任何

clone（）

。只需将

pageContents

存储在

tempContents

变量中，并使用该变量即可，您无需克隆该变量。只需设置

pageContents=$（pageContents）

，然后在

pageContents

上执行图像替换，然后

返回pageContents.html（）
您不需要克隆它。只需设置
pageContents=$（pageContents）
，然后在
pageContents
上执行图像替换，然后
返回pageContents.html（）
因为pageContents只是一个字符串，所以需要返回它的修改版本。试试这个：

function replaceImages(pageContents){
  // save jQuery object
  var $pageContents = $(pageContents);

  $pageContents.find('img').each(function(){
    var domImage = $(this);

    //this is something like ".../Images/img.jpg"
    var imageLocation = domImage.attr('src'); 

    //this returns the proper data-uri representation of the image
    var dataUri = GlobalZipLoader.loadImage('epub.zip://' + imageLocation);

    //this doesn't seem to "stick"
    domImage.attr('src', dataUri);
  });

  // return contents of the modified jQuery object
  return $pageContents.html();
}

由于pageContents只是一个字符串，因此需要返回它的修改版本。试试这个：

function replaceImages(pageContents){
  // save jQuery object
  var $pageContents = $(pageContents);

  $pageContents.find('img').each(function(){
    var domImage = $(this);

    //this is something like ".../Images/img.jpg"
    var imageLocation = domImage.attr('src'); 

    //this returns the proper data-uri representation of the image
    var dataUri = GlobalZipLoader.loadImage('epub.zip://' + imageLocation);

    //this doesn't seem to "stick"
    domImage.attr('src', dataUri);
  });

  // return contents of the modified jQuery object
  return $pageContents.html();
}

感谢您查看，所以在dom字符串附加到我的页面之前无法更改它？如果我不得不等到它好了，但它会产生大量的404，如果必要的话，我想避免这种情况。再次感谢。感谢您查看，所以在dom字符串附加到我的页面之前无法更改它？如果我不得不等到它好了，但它会产生大量的404，如果必要的话，我想避免这种情况。再次感谢。
pageContents
是一个缓存项，您可能需要在返回它之前刷新它。看起来确实有一些奇怪的缓存问题，我如何在发送回它之前刷新pageContents？哦，我看到了新的注释。。。我将添加一个答案。
pageContents
是一个缓存项，您可能需要在返回它之前刷新它。看起来确实存在一些奇怪的缓存问题，我如何在发送它之前刷新页面内容？哦，我看到了新的注释。。。我会补充一个答案。