在手机 EDGE 上测试网页设计答案

【问题标题】：testing webdesign on mobile phone EDGE在手机 EDGE 上测试网页设计
【发布时间】：2018-06-26 19:23:01
【问题描述】：

我正在尝试运行图片库查看器。它目前在 Google Chrome 中按预期工作。

我已将其移至 windows phone 以测试移动 Edge 浏览器。 HTML、CSS 和 JavaScript 似乎都可以正常工作，但 img 标记似乎有一些问题并且无法加载。

我浏览了有关 Edge 等的官方 Microsoft 论坛，但找不到与此问题相关的任何内容。

然后简化代码，并给出同样的错误，img 标签不显示实际的 img。

<html>
    <head></head>
    <body>
        <img src='p0.jpg'>
        <p></p>
        <script>
            document.querySelector('p').textContent = document.querySelector('img').src
        </script>
    </body>
</html>

当我在浏览器中查看它时，我在最左角看到一个小的“损坏的图像”图标，位于： file:///C:/Data/Users/Public/Documents/Gallery/pictures/p0.jpg

如何在本地（移动）参考中显示它？图像文件有问题吗？我应该如何测试网站的整体用户体验，就像我是移动浏览器一样？

【问题讨论】：

您能否将当前结果的一些屏幕截图和实际图像发布到 imgur 或其他东西上？现在调查这个
imgur.com/a/Dtnox -- 两种变体

标签： html image testing windows-phone localhost

【解决方案1】：

在尝试让图像加载失败后，我自己进行了一些广泛的测试，但我还没有找到它的问题。由于我缺乏结果，我觉得唯一可能的问题是您的图像要么没有被复制，要么您将其放置在错误的目录中。最好的做法是使用 img 文件夹来存储所有图像，然后您可以移动整个文件。我只能建议您的图像文件位于您引用的正确位置（在这种情况下，与您的 HTML 文件相同的文件夹）。

另一个可能的解决方案是尝试引用在线托管的图像（在 Google 上搜索某些内容，然后复制粘贴完整的 URL）。确保它首先在桌面上运行，然后在移动设备上试用。如果它有效，那就太好了 - 您的问题与您自己托管的图像文件/位置有关。如果它不起作用，可能值得稍微深入研究一下，找出设备/浏览器出了什么问题。

对不起，这不是一个很有用的答案，但我希望它对你有所帮助

【讨论】：