Javascript 使用if/else根据名称向表单添加不同的图像_Javascript_Html

Javascript 使用if/else根据名称向表单添加不同的图像

javascript html

Javascript 使用if/else根据名称向表单添加不同的图像,javascript,html,Javascript,Html,我试图在html中插入图像值，以根据名称替换src，因此如果templateName=Javascript的名称，我可以将src值设置为类似say（）的值，并使用Javascript中的if/else语句对其他类别执行此操作我的脚本看起来像这样，但在语法上有一些错误 var imageChoosernator = function () { if (#templateName == "Javascript") { img = <im

我试图在html中插入图像值，以根据名称替换src，因此如果templateName=Javascript的名称，我可以将src值设置为类似say（）的值，并使用Javascript中的if/else语句对其他类别执行此操作

我的脚本看起来像这样，但在语法上有一些错误

var imageChoosernator = function () {
        if (#templateName == "Javascript")
        {
            img = <img src="htp://www.w3devcampus.com/wp-content/uploads/logoAndOther/logo_JavaScript.png">;
        }
 `   }

var imageChoosernator=函数（）{
if（#templateName==“Javascript”）
{
img=；
}
`   }

有人能指导我找到合适的解决方案吗？

\templateName

中的

\code>是错误的。了解允许的变量字符
img=”；//串起
}否则{
img=“”；
}
//最后将img附加到元素#imgContainer
document.querySelector（“imgContainer”）.insertAdjacentHTML（“beforeed”，img）；
}
imageChoosernator（）；//施展魔法
在将查询加载到页面时，可以使用jQuery.prepend（）方法替换图像src。
如果在html中，您将id名称命名为“JavaScript”，如-
var img = "";
var templateName = "Javascript";

function imageChoosernator () {
    if (templateName === "Javascript") { // remove unallowed #
        img = '<img src="js.png">';      // enclose into String
    } else {
        img = '<img src="someting.png">';
    }
    // Finally append img to element #imgContainer
    document.querySelector("#imgContainer").insertAdjacentHTML("beforeend", img );
}

imageChoosernator(); // Do the magic

divid=“JavaScript”>
div id=“templateName2”>

要更改图像源，可以使用以下命令-
div id="JavaScript"><img id="imgNew1"  src="oldImg1.png" />   
div id="templateName2"><img id="imgNew2"  src="oldImg2.png" /> 

$（'#templateName1'）。前置（''）
$（'#templateName2'）。前置（''）

您需要阅读文档
要在创建相同内容的同时自动化src更改，如下所示-
$('#templateName1').prepend('<img id="imgNew" src="newImg1.png" />')
$('#templateName2').prepend('<img id="imgNew" src="newImg2.png" />')


var slidemages=new Array（）//创建新数组以预加载图像
slideimages[0]=新建图像（）//创建图像对象的新实例
slideimages[0].src=“firstImg.png”//将图像对象src属性设置为图像的src，在此过程中预加载该图像
slideimages[1]=新图像（）
slideimages[1].src=“secondcarImg.png”
slideimages[2]=新图像（）
slideimages[2].src=“thirdImg.png”
//变量，该变量将在图像中递增
var步长=0
var whichimage=0
函数slideit（）{
//如果浏览器不支持图像对象，请退出。
如果（！document.images）
返回
document.getElementById（'slide'）.src=slideimages[step].src
whichimage=步进
如果（Step）这会起作用，但我正在尝试以自动化的方式创建一个名为Javascript的项目的新实例或另一个名为SQL的实例，并且由于元素的名称匹配，因此将创建一个图像并将其作为该元素的化身插入。在创建inst时，是否要自动化源更改相同的实例？不。每个实例都不同。我已经编辑了上面的答案，如何使用相同的实例进行编辑。现在，您只需要像我上面所做的那样创建每个不同的实例。感谢您的帮助，我将看看是否可以合并该技术。
<html>
<head>
<script type="text/javascript">
  var slideimages = new Array() // create new array to preload images
  slideimages[0] = new Image() // create new instance of image object
  slideimages[0].src = "firstImg.png" // set image object src property to an image's src, preloading that image in the process
  slideimages[1] = new Image()
  slideimages[1].src = "secondcarImg.png"
  slideimages[2] = new Image()
  slideimages[2].src = "thirdImg.png"
</script>
</head>
<body>
 <a href="javascript:slidelink()"><img src="firstImg.img" id="slide" width=100 height=56 /></a>

  <script type="text/javascript">

  //variable that will increment through the images
  var step = 0
  var whichimage = 0
  function slideit(){
  //if browser does not support the image object, exit.
  if (!document.images)
  return
  document.getElementById('slide').src = slideimages[step].src
  whichimage = step
  if (step<2)
    step++
  else
    step=0

 }

</script>
</body>
</html>