从Javascript变量中删除随机HTML图像 [英] Remove random HTML images from a Javascript variable

问题描述

我是Java语言的新手，所以如果使用错误的术语，我深表歉意.我有一个代码需要显示一些HTML图像，这些图像存储为在特定位置(由类定义)中包含多个项目的变量，例如:

I am new to Javascript so I apologize if I am using the wrong terms. I have a code where I need to show some HTML images, stored as variables containing multiple items in specific positions (defined by the class) such as:

 var fruit = ["<img class='item1' src='" + Banana + "'>" + 
        "<img class='item2' src='" + Apple + "'>" + 
        "<img class='item3' src='" + Grapes + "'>" + 
        "<img class='item4' src='" + Banana + "'>" +
        "<img class='item5' src='" + Grapes + "'>" + 
        "<img class='item6' src='" + Pear + "'>"],

稍后，我需要在称为刺激的更大图片中使用所有这些项目，例如:

Later, I need to use all of these items in a bigger picture called stimulus, e.g.:

stimulus: "<div class='container'> <img class='background' src='" + Background + "'>" + fruit + "</div>",

但是，我只需要显示水果中列出的6个中的3个随机水果.例如，我需要得到类似的东西:

But then I need to only show 3 random fruits among the 6 listed in fruit. For instance, I would need to get something like:

stimulus: "<div class='container'> <img class='background' src='" + Background + "'>" + half_fruit + "</div>",

其中: var half_fruit = [< img class ='item1'src ='"+香蕉+''>';+"< img class ='item3'src ='"+葡萄+''>';+"< img class ='item6'src ='"+梨+'''>"]

即使我的图像从技术上讲不是数组的项目，有什么办法可以做到这一点?我有特定的水果组合(不仅是示例中的一个，总共约有30个)，我需要删除该特定组合中的三个水果，同时还要使其他水果保持与以前相同的位置.这就是为什么我不将图像作为字符串存储在数组中的原因.这些变量定义为var Banana = gorilla.stimuliURL('Banana.png');等(大猩猩是用于创建实验的平台； stimuliURL函数从在线存储库中调用图像地址).谢谢您的时间！

Is there any way I can do this, even if my images are not technically items of an array? I have specific fruit combinations (not just the one in the example, roughly 30 in total) and I need to remove 3 items of the ones in that specific combination while also leaving the others in the same position as they were before. This is why I am not storing images as strings in an array. Those variables are defined as var Banana = gorilla.stimuliURL('Banana.png'); etc. (Gorilla is a platform for creating experiments; the stimuliURL function calls image addresses from an online repository). Thank you for your time!

推荐答案

感谢您的评论，我按如下所示重新排列了变量.首先，我为每个图像创建变量以从大猩猩访问它们的地址，例如

Thanks to your comments, I rearranged the variables as follows. First, I created variables for each image to access their addresses from Gorilla, e.g.

var banana_img = gorilla.stimuliURL('banana.png');

然后，我为每个位置的每个水果创建了变量:

Then, I created variables for each fruit in each position:

var banana = ["<img class='item1' src='" + banana_img + "'>", "<img class='item2' src='" + banana_img+ "'>", "<img class='item3' src='" + banana_img+ "'>", "<img class='item4' src='" + banana_img + "'>", "<img class='item5' src='" + banana_img + "'>", "<img class='item6' src='" + banana_img + "'>"];

然后，我将每个水果组合保存为变量，例如

Then, I saved each fruit combination as a variable, e.g.

var fruit = [banana[0], apple[1], grapes[2], banana[3], grapes[4], pear[5]]

最后，我对它进行了排序并选择了前3个，只得到了三个随机项:

FInally, I sorted it and selected the first 3 to get only three random items:

half_fruit = fruit.sort( function() { return 0.5 - Math.random() } ).slice(0, 3).join(" ");

如果您找到更好的方法，请在下面回答或评论！

Answer or comment below if you find a better way to do this!

这篇关于从Javascript变量中删除随机HTML图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！