通过JS结合可变字母的变量，细化一个将图片的src赋值为变量的变量答案

【问题标题】：Refine a variable that Assign src of image into a variable through JS combined with a variable of changing letters通过JS结合可变字母的变量，细化一个将图片的src赋值为变量的变量
【发布时间】：2021-02-11 07:30:17
【问题描述】：

我有一个更改字母的变量，该变量在某些特定时间间隔内发生变化。现在在这个快速轮盘赌中，我还想添加与这些字母组合出现的图像

例如

'字母'

'image.jpg',

'字母'

这里是实际的片段：

https://codepen.io/cat999/pen/bGBBVgm

代码部分极其简单，请看：

var a = [, 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o', 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o', 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o',
    'image.jpg',
    'image.jpg',
    'image.jpg',
];

c = 0, 5;
setInterval(function() {
    c++;
    var letter = a[c];
    var length = a.length;
    if (c > length) { c = 0, 5; }
    $("body").text(letter);
}, 25);

您能否帮我完善我的变量，以便图像（“image.jpg”）可以出现在这个快速轮盘赌中？

期待您的宝贵帮助°

【问题讨论】：

你到底想要什么？您是否也希望显示图像？
如果最后 4 个字符是 .jpg 或 .png 则添加一个检查，然后显示一个 <img> 元素，其 src 指向图像？
@AD-1 没错！
@Kristian 你能教我如何通过我的代码或编辑我的代码笔吗？谢谢！

标签： javascript html jquery css variables

【解决方案1】：

如果最后 4 个字符是 .jpg 或 .png 则添加一个检查，然后显示一个 <img> 元素，其 src 指向图像？

点击“运行代码 sn-p”（图片取自 google 的 logo，因为它很小且加载速度快）

var a = [, 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o', 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o', 'A', 'a', 'B', 'b', 'C', 'c', 'De', 'De', 'S', 's', 'T', 't', 'U', 'u', 'D', 'd', 'I', 'i', 'O', 'o',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
    'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_92x30dp.png',
];

c = 0, 5;
setInterval(function() {
    c++;
    var letter = a[c];
    var length = a.length;
    if (c > length) { c = 0, 5; }
    
  if(letter != undefined && letter.length>5 && (letter.substr(letter.length-4, 4)==".png" || letter.substr(letter.length-4, 4)==".jpg") ) {
    $("#mydiv").html("<img src='"+letter+"'>");
  } else { 
    $("#mydiv").text(letter);
  }
}, 25);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mydiv"></div>

【讨论】：