Question

我正在尝试将图像值插入到html中以根据名称替换src，所以如果templateName = Javascript的名称我可以使src值=类似于说出（http://www.w3devcampus.com/wp-content/uploads/logoAndOther/logo_JavaScript.png）并执行此操作对于其他类别以及在javascript中使用if / else语句。

我的脚本看起来像这样，但语法

有一些错误

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

有人可以引导我找到合适的解决方案吗？

Answer 1

#中的

#templateName是错误的。知道允许的变量字符。

img = <img <img是一个未启动的字符串。知道如何将值括在String中。

`＆lt;＆lt;＆lt;你不能在你的代码周围浮动这样的角色（希望只是一个编辑错误）。

由于您没有显示大部分代码，因此修复程序将类似于：

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

Answer 2

您可以使用jQuery .prepend（）方法在将查询加载到页面时替换图像src。如果在HTML中，您已将ID名称作为＆＃39; JavaScript＆＃39;像 -

div id="JavaScript"><img id="imgNew1"  src="oldImg1.png" />   
div id="templateName2"><img id="imgNew2"  src="oldImg2.png" />

要更改以下图像源，可以使用 -

$('#templateName1').prepend('<img id="imgNew" src="newImg1.png" />')
$('#templateName2').prepend('<img id="imgNew" src="newImg2.png" />')

您需要阅读文档here

要自动化src更改，同时创建相同的内容将变为 -

<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>

使用if / else

2 个答案: