我有以下内容:
var diff = maxval - ui.value;
$( "#output").html( diff?"diff. of " + diff : "no diff" );
现在我想为每个图像添加一个图像,如果值有差异,即:
var diff = maxval - ui.value;
$( "#output").html( diff?"<img src='yes.png' height='50' width='50' /> diff. of " + diff : "<img src='no.png' height='50' width='50' /> no diff" );
好像这行不通,我怎样才能为那个输出 div 中的每个设置一个图像?
最佳答案
你是根据diff
来检查的,你不是要检查它是否大于0吗?
负数的计算结果为 true
。
Boolean(-1);//true
Boolean(50);//true
Boolean(-500);//true
Boolean(-0.001);//true
Boolean(0);//false
下面是我如何创建一个新图像,其源属性基于 diff 大于 0。
请注意,我使用的是实际元素,因此我正在更改 src
属性而不是字符串值,我相信这会创建更具可读性的代码。
var diff = maxval - ui.value;
var img = new Image();
img.src = (diff > 0 ) ? "yes.png" : "no.png";
img.width = "50px";
img.height = "50px";
$( "#output").empty().append(img);
这是一个完全普通的解决方案,包括文本节点:
var diff = maxval - ui.value;
var img = new Image();
img.src = (diff > 0 ) ? "yes.png" : "no.png"; // assuming you mean to check positive value
img.width = "50px";
img.height = "50px";
var el = document.getElementById("output");
el.appendChild(img);
var text = (diff > 0) ? "diff" : "no diff";
var txt = document.createTextNode(text);
el.appendChild(txt);
虽然这种“较长”代码的优势初看起来并不明显,但它非常容易操作。我直接使用 DOM 元素而不是字符串,我可以轻松地添加或删除属性、更改属性、克隆它们等。
关于javascript - 在js中使用<img src>?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16795216/