Question

我现在有了这个代码来替换点击上的一些文字，但符号很大，我尝试了其他较小的，尺寸不一致。如何在其中放置图像链接而不是符号？

我想用图片网址替换u25b2和u25bc ...

 $("#button").click(function() {
if ($(this).is(':checked')) {
$("#label").text("\u25b2 close");
} else {
$("#label").text("\u25bc click for details");
}
});
$("#button2").click(function() {
if ($(this).is(':checked')) {
$("#label2").text("\u25b2 close");
} else {
$("#label2").text("\u25bc click for details");
}
});
$("#button3").click(function() {
if ($(this).is(':checked')) {
$("#label3").text("\u25b2 close");
} else {
$("#label3").text("\u25bc click for details");
}
});

Answer 1

您可以创建一个图像对象并将其插入：

var img = new Image();
img.src = "http://whatever.com/myimage.jpg";
$("#label2").empty().append(img);

您可以在纯CSS中使用font-size或在特定对象上使用jQuery .css("font-size", xxx);来控制您使用的符号大小，而不是使用图像。通常，如果字体可以解决您的问题，那么它比使用图像更好（带宽更少，加载的资源更少，内存消耗更少，可以无限扩展到任何大小等等）。

Answer 2

您还可以使用此代码构建图像元素并将其附加到任何其他元素。

＆＃13;

var img = $("<img>").attr("src", "http://cdn.wallpapers.com/Images/WallPapers/previews/tn_lakesidefireworks.jpg"); // you can also add other attr here like img.attr("key","val");

$("#lbl").empty().append(img);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="lbl"></div>

＆＃13;

如何在JQuery脚本中使用图像URL？

2 个答案: