文章/答案/技术大牛

发布

问如果(!document.images)
EN

Stack Overflow用户

提问于 2013-02-16 22:39:17

回答 2查看 3.8K关注 0票数 3

我一直在使用JavaScript教程来帮助我在大学作业中实现一些JavaScript。因此，我使用了一个来帮助我创建一个图像幻灯片，它包含一个if语句，看起来像下面的一个。

if (!document.images)
    return
document.images.SlideShow1.src=eval("image"+slide+".src

然而，我不太确定它在做什么，特别是(!document.images)部分。

编辑

另外，正如我所看到的，我在这篇教程中做了一个糟糕的选择，谁能告诉我如何制作一个好的图像幻灯片，或者简单地把我引向一个好的教程？这是我目前使用的所有代码

<head>
<script type="text/javascript">
        <!--
        var image1=new Image()
        image1.src="Images/Foam2012/Misty.gif"
        var image2=new Image()
        image2.src="Images/Foam2012/Foamy.gif"
        var image3=new Image()
        image3.src="Images/Foam2012/17.gif"
        var image4=new Image()
        image4.src="Images/Foam2012/16.gif"
        var image5=new Image()
        image5.src="Images/Foam2012/2.gif"
        var image6=new Image()
        image6.src="Images/Oxjam2012/Rainbow.gif"
        var image7=new Image()
        image7.src="Images/Oxjam2012/17.gif"
        var image8=new Image()
        image8.src="Images/Oxjam2012/9.gif"
        var image9=new Image()
        image9.src="Images/Oxjam2012/2.gif"
        var image10=new Image()
        image10.src="Images/RagDay2012/GasMask.gif"
        var image11=new Image()
        image11.src="Images/RagDay2012/22.gif"
        var image12=new Image()
        image12.src="Images/RagDay2012/21.gif"
        var image13=new Image()
        image13.src="Images/RagDay2012/20.gif"
        var image14=new Image()
        image14.src="Images/RagDay2012/16.gif"
        var image15=new Image()
        image15.src="Images/RagDay2012/6.gif"
        var image16=new Image()
        image16.src="Images/RagDay2012/5.gif"       
        var image17=new Image()
        image17.src="Images/RagDay2012/4.gif"
        var image18=new Image()
        image18.src="Images/RagDay2012/1.gif"
        var image19=new Image()
        image19.src="Images/UV2012/17.gif"
        var image20=new Image()
        image20.src="Images/UV2012/14.gif"
        var image21=new Image()
        image21.src="Images/UV2012/9.gif"
        var image22=new Image()
        image22.src="Images/UV2012/7.gif"
        var image23=new Image()
        image23.src="Images/UV2012/6.gif"
        //-->
    </script>
</head>
<body>
<img id="SlideShow1" style="padding-bottom: 5px" src="Images/Foam2012/Foamy.gif"      width="350px" height="300px" alt="Image Slideshow"/>
    <script type="text/javascript">
        <!--
        var slide = 1
        //Declares a variable called slide which equals 1
        function slideit(){
        if (!document.images)
        return
        document.images.SlideShow1.src=eval("image"+slide+".src")
        if (slide<23)
        slide++
        else
        slide = 1
        //call function "slideit()" every 1.5 seconds
        setTimeout("slideit()",1500)
        }
        slideit()
        //-->
    </script>
</body>

javascript

回答 2

Stack Overflow用户

回答已采纳

发布于 2013-02-16 23:20:12

把这篇教程放下！它是古老的..。

if (!document.images)
   return

这是对images集合进行功能嗅探，这是一种获取<img>元素的老式方法。从Netscape 3开始，每个支持JavaScript的浏览器都支持该数组，因此它揭示了一个1996多年前的脚本。

...and (b)很糟糕。

document.images.SlideShow1.src=eval("image"+slide+".src");

这是一个真正不知道自己在做什么的人的标志。您始终可以使用[]语法访问对象属性：

document.images.SlideShow1.src=window['image'+slide].src;

因此，根本不需要使用在字符串中创建JavaScript表达式并对其进行eval这种缓慢、危险、可怕的方法-即使按照1996年的标准，这也是很糟糕的。

但即便如此，在window中按名称访问变量通常也是有问题的。

预计到达时间：

谁能教我如何制作一个好的图像幻灯片

嗯，我不知道最好的幻灯片放映--我相信会有人介入推广一个最受欢迎的现有库，但我们肯定可以改进你作为例子的代码。

因此，将一系列对象放在单独编号的变量中通常表示您真正想要的是一个数组：

# List of image paths inside Images/
#
var paths= [
    'Foam2012/Misty.gif', 'Foam2012/Foamy.gif', 'Foam2012/17.gif', 'Foam2012/16.gif', 'Foam2012/2.gif',
    'Oxjam2012/Rainbow.gif', 'Oxjam2012/17.gif', 'Oxjam2012/9.gif', 'Oxjam2012/2.gif',
    'RagDay2012/GasMask.gif', 'RagDay2012/22.gif', 'RagDay2012/21.gif', 'RagDay2012/20.gif', 'RagDay2012/16.gif', 'RagDay2012/6.gif', 'RagDay2012/5.gif', 'RagDay2012/4.gif', 'RagDay2012/1.gif',
    'UV2012/17.gif', 'UV2012/14.gif', 'UV2012/9.gif', 'UV2012/7.gif', 'UV2012/6.gif',
];

# Preload images
#
var images= [];
for (var i= 0; i<paths.length; i++) {
    var image= new Image();
    image.src= 'Images/'+paths[i];
    images.push(image);
}

# Rotate image every 1.5s
#
var imagei= 0;
setInterval(function() {
    imagei= (imagei+1) % images.length;
    document.getElementById('SlideShow1').src= images[imagei].src;
}, 1500);

您还可以做其他事情来改善这一点-例如，将所有图像作为<img>标记放在页面中可能会更好，这样它们的内容对于非JavaScript代理(如搜索引擎)是可见的。然后，您可以使用display CSS样式显示和隐藏它们。

还是直接给我一个好的教程？

It's a problem。我已经有一段时间没有看过了，但标准通常都很差。

虽然我不是jQuery的粉丝，但您可能会发现使用它的一些教程材料很有帮助，因为至少它倾向于以一种更现代的方式编写。

票数 3

Stack Overflow用户

发布于 2013-02-16 22:41:38

if (!document.images)

测试文档中是否存在images (非空)，因为

对于不同的浏览器，其属性具有不同的名称，因此页面可能没有图像

对于document.images，似乎没有理由测试属性的存在：http://www.w3schools.com/jsref/coll_doc_images.asp

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/14911452

复制

相似问题

问如果(!document.images)
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果(!document.images)EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如果(!document.images)
EN