Question

我已编写此代码，并且我正在尝试对其进行优化。

            if (imageEntity.get('image').get('value')[480]) {
                sliderImages.push('<div style="opacity: ' + ((index === 0)? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(./../../connect/img/user-images/' + imageEntity.get('image').get('value')[480]+'?_='+Date.now() + ') center center no-repeat; background-size: cover;"></div>');
            } else if (imageEntity.get('image').get('value')[150]){
                sliderImages.push('<div style="opacity: ' + ((index === 0)? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(./../../connect/img/user-images/' + imageEntity.get('image').get('value')[150]+'?_='+Date.now() + ') center center no-repeat; background-size: cover;"></div>');
            } else {
                sliderImages.push('<div style="opacity: ' + ((index === 0)? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(img/ctrl-thumb.png) center center no-repeat; background-color: #f6f6f6;"></div>');
            }

如何将sliderImages.Push合并为一个？有imageEntity.get('image').get('value')[150]+'?_='+Date.now() +我如何根据可用的内容放置480或150？

由于

Answer 1

考虑这段代码。在JavaScript中，您可以有条件地设置一个变量。

var x = new Object();
var y = (window.i || window.x);

在上述情况下，变量“i”未定义，但变量“x”未定义。使用如上所示的评估设置变量“y”使得“y”设置为“x”的值，因为“i”未定义。但是，请事先警告以下情况不起作用：

var x = new Object();
var y = (i || x);

要使评估成功，您需要将变量用作其他对象的成员。也就是说，可以像这样修改你的代码：

var i = (imageEntity.get('image').get('value')[480] || imageEntity.get('image').get('value')[150]);
if(!i){
    sliderImages.push('<div style="opacity: ' + ((index === 0) ? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(img/ctrl-thumb.png) center center no-repeat; background-color: #f6f6f6;"></div>');
}else{
    sliderImages.push('<div style="opacity: ' + ((index === 0) ? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(./../../connect/img/user-images/' + i + '?_=' + Date.now() + ') center center no-repeat; background-size: cover;"></div>');
}

Answer 2

var image = imageEntity.get('image').get('value')[480] || imageEntity.get('image').get('value')[150];
if (image) {
    sliderImages.push('<div style="opacity: ' + ((index === 0)? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(./../../connect/img/user-images/' + image + '?_=' + Date.now() + ') center center no-repeat; background-size: cover;"></div>');
} else {
    sliderImages.push('<div style="opacity: ' + ((index === 0)? 1 : 0) + '; transition: opacity .5s ease; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(img/ctrl-thumb.png) center center no-repeat; background-color: #f6f6f6;"></div>');
}

您应该为div使用CSS类，并且只能通过JavaScript设置动态值。

Answer 3

尽量不要重复你重复的内容......

var img = imageEntity.get( 'image' );
if ( img.get('value')[480] || img.get('value')[150] ) {}

两个条件合二为一

3 个答案: