javascript - 隐藏与 css vs JS 创建元素 vs ajax

Question

如果照片不存在 (404)，我想隐藏一些显示照片标题和照片其他详细信息的 div，然后当用户单击页面 ex 中的另一张照片时再次显示这些 div。在 related photos 部分。 我曾使用 css 隐藏此 div，然后使用 js 再次显示它们。 我考虑过使用 css 隐藏，使用 JavaScript 创建元素并使用 ajax 显示 html。有没有更好的方法可以在不使用非语义 HTML 的情况下做到这一点？

<?php 
        if(PHOTO::exists($_GET["photo"])) {
            ?>

        <div id="title_wrap">
            <div id="title"><?php echo $photo->get_title(); ?></div>
        </div>

        <div id="time_views">
            <div id="time"><?php echo $photo->get_time();?></div>
            <div id="views"><?php echo $photo->get_views(); ?></div>          
        </div>
         <?php
        }
?>

因此，如果照片不存在，这些 div(#title_wrap、#time_views)将不会显示，但是当用户单击相关部分中的照片时，这些 div 需要显示并更新为通过 AJAX 加载的新信息。那么显示和隐藏这些 div 的最佳方式是什么？

Answer 1

如果您使用 ajax 拉入图像，您可以在创建新图像元素之前测试数据是否可用，然后跳过它。这样你就不会用隐藏元素加载你的页面。添加到页面的每个元素都会占用更多内存。如果您在页面中加载许多图像标签失败并且您只是简单地隐藏它们，那么页面将会变大，具体取决于此循环的大小。当您收到回复时检查数据，如果您收到 404 则跳过它并转到下一个加载请求并且不要将其添加到页面。谷歌机器人也不喜欢 404 消息。因此，将不良图像标签加载到您的页面将无效或不干净，谷歌将降低您的 SEO 分数。

您应该考虑的另一件事是向服务器发送请求，让服务器用它拥有的文件列表进行响应，这样您只发送对服务器上的内容的加载请求，而不是猜测。

[更新]

<?php if(file_exists($_GET["photo"])): ?>
     <div id="title_wrap">
         <div id="title"><?php echo $photo->get_title(); ?></div>
     </div>

     <div id="time_views">
         <div id="time"><?php echo $photo->get_time();?></div>
         <div id="views"><?php echo $photo->get_views(); ?></div>          
     </div>
<?php endif; ?>
<div id="relatedImages>this is outside the if statement and will be displayed even if the if statement is false</div>

如果 file_exists() 返回 false，那么这些都不会显示。所以你不必用 css 隐藏它，因为它不会出现在页面上。如果没有要显示的数据，则显示 div 毫无意义。解决方案不是 css 或 JavaScript，如果文件不存在，您不应该显示内容。

这部分代码也不是你的问题。问题是您让用户可以选择不存在的图像。如果你只给用户选择你有文件的图像的选项，那么 file_exists() 每次都会返回 true，你永远不需要处理 404 错误。

根据您的问题以及您编写 PHP 的方式，我强烈建议您购买一本有关 PHP 的书籍。您应该刷新运算符和 if 语句。查看完有关 if 语句的部分后，请查看内联 php 语句的格式。这将使您在网络编程方面走上非常成功的职业生涯。 (这本书的链接是我在搜索亚马逊时找到的第一个)这将是一个好的开始。还可以查看 http://www.w3schools.com/php/他们有一些初学者教程可以帮助你。并记住 KISS(Keep It Stupid Simple)。

http://www.amazon.com/PHP-Absolute-Beginners-Jason-Lengstorf/dp/1430268158/ref=sr_1_1?s=books&ie=UTF8&qid=1422575607&sr=1-1&keywords=php+absolute+beginner&pebp=1422575612138&peasin=1430268158