Javascript SRC 在 iPhone Safari 和 Android 中不起作用

Question

根据要求，我需要动态更改图像 src，因此我使用 JavaScript 来完成此操作。

我正在使用 id 访问图像并根据用户点击添加新的 src，下面是我遇到问题的代码。在整个过程中，我得到了更新的图像 SRC 数据，但看起来很奇怪，我可以在桌面浏览器中看到更新的图像，但在 Mobile safari 和 Andriod 中看不到。

请帮忙

//This is id for fetching the user data
var text_food=document.getElementById("plateText_food");

//User Data
var currentFoodName=text_food.innerHTML; 

//as per the requirement removing space and adding "-"
var regExp = /\s+/g;
var foodName=currentFoodName.replace(regExp,'-');

//Detail URL
var detailURL_food01 = 'img/beer_images_png/' + foodName + '.png';

//id FOR ACCESSING IMAGE 
var updateFoodImage=document.getElementById("detailURL_food");

//adding updated src
updateFoodImage.src = detailURL_food01;

Answer 1

只要在正确的时间运行，这个应该可以工作。这两种浏览器在渲染和加载内容时都遇到问题，速度要慢得多...在移动设备上工作的性质，这意味着您需要确定您的代码在 DOM 加载后运行，在 <例如，code>window.onload，否则当您执行document.getElementById("plateText_food")时...该id="plateText_food"元素可能不会已经在 DOM 中准备好查找了。

最后尝试一个简单的 alert() 来测试这一点（如果之前出错，您将不会收到警报，这是另一个指标）：

alert(detailURL_food01);
updateFoodImage.src = detailURL_food01;