用jquery给li添加id同时添加img
假设有30个li，图片地址为pic/skin_1.jpg完整写法是<liid="skin1"><imgsrc="pic/skin_1.jpg"/></li><liid="...
假设有30个li，图片地址为pic/skin_1.jpg
完整写法是
<li id="skin1"><img src="pic/skin_1.jpg"/></li>
<li id="skin2"><img src="pic/skin_2.jpg"/></li>
。。。此处省略一大段
<li id="skin30"><img src="pic/skin_30.jpg"/></li>
但是这样一来，代码就太冗余了，我希望通过jquery的遍历方法给每个li按照顺序自动添加id并添加img代码。
也就是说，我只需要在html代码里面写30个li标签就O了
请教高手，如何实现
ps：尽量不要使用if else语句，不知怎么回事，一遇到if else，jquery代码就全部失效 展开
完整写法是
<li id="skin1"><img src="pic/skin_1.jpg"/></li>
<li id="skin2"><img src="pic/skin_2.jpg"/></li>
。。。此处省略一大段
<li id="skin30"><img src="pic/skin_30.jpg"/></li>
但是这样一来，代码就太冗余了，我希望通过jquery的遍历方法给每个li按照顺序自动添加id并添加img代码。
也就是说，我只需要在html代码里面写30个li标签就O了
请教高手，如何实现
ps：尽量不要使用if else语句，不知怎么回事，一遇到if else，jquery代码就全部失效 展开
3个回答
展开全部
$(function(){
$("li").each(function(index){
$(this).attr("id","skin"+(index+1)).html('<img src="pic/skin_'+(index+1)+'.jpg"/> ');
//或者可以这样 var img=$("img").attr("src","pic/skin_'+(index+1)+'.jpg") $(this).attr("id","skin"+(index+1)).append(img);
});
});
$("li").each(function(index){
$(this).attr("id","skin"+(index+1)).html('<img src="pic/skin_'+(index+1)+'.jpg"/> ');
//或者可以这样 var img=$("img").attr("src","pic/skin_'+(index+1)+'.jpg") $(this).attr("id","skin"+(index+1)).append(img);
});
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
按照你的这个意思，其实，在画面上HTML里好像连LI标签都不用写，因为看起来好像LI的ID跟img标签的src的值都有一样的变化规律，所以应该都可以动态画出来。代码在下面：
<html>
<head>
<script type="text/javascript" src="
<script language="javascript">
$(document).ready(function(){
var container = $("#imgdata");
for(var i=1; i<=30; i++){
var liID = "skin" + i;
var imgSrc = "pic/skin_" + i + ".jpg";
var liObj = $("<li>").attr("id",liID);
var imgObj = $("<img>").attr("src",imgSrc);
//添加到画面上的UL标签里
liObj.append(imgObj).appendTo("#imgdata");
}
});
</script>
</head>
<body >
<ul id="imgdata">
<ul>
</body>
</html>
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
$(document).ready(function(){
for (var i = 1 ; i <= 30 ; i++) {
var li = "<li id='skin+"i"+'><img src='pic/skin_+"i"+.jpg'/></li>";
$("body").append($(li));
}
});这样你HTML里也不用写li了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
|
广告 您可能关注的内容 |
