我加入新李 & 格在页面上元素的jQuery .html()
功能的手段。我传递的字符串有一个硬编码的类。但它仍然没有风格化,但类已经在css文件中定义了。所以我通过使用jQuery .css()
函数添加样式,但仍然没有样式。我怎样才能添加CSS到这些动态添加的HTML元素?jQuery的添加CSS来动态添加HTML元素
for(i=0; i<directionList.length; i++) {
html += "<li class='dir-list'> \
<div class='dir-loc'><b>" + directionList[i].location + "</b></div><br /> \
<div class='dir-dest'> \
<div class='dir-dest-icon'><img src='markers/new/transit-small.gif' class='dir-va-mid' title='by transit'/></div> \
<div class='dir-dest-action'><span class='dir'>Ride to</span></div> \
<div class='dir-dest-loc'><span class='dir'><b>" + directionList[i].destination + "</b></span></div> \
<ul class='dir-routes'>";
// add routes
var routes = directionList[i].routes;
for(j=0; j<routes.length; j++){
html += "<li> \
<div class='dir-route-type-icon'><img src='markers/new/" + routes[j].type + "-small.gif' class='dir-va-mid' title='" + routes[j].type + "'/></div> \
<div class='dir-route-name'><span class='dir-va-mid' >" + routes[j].name + "</span></div> \
</li>";
}
html += "</ul> \
</div> \
</li>";
/*
var index = parseFloat(i)+1;
directions += "<li>" + directionList[i].location + "<span>";
//get routes
var routes = [];
routes = directionList[i].routes;
directions += "<ul>";
for(j=0; j<routes.length; j++){
directions += "<li> (" + routes[j].type + ") " + routes[j].name + "</li>" ;
}
directions += "</ul>";
directions += "</li>";
*/
}
html += "</ul>";
$('#directions').html(html);
CSS:
#directions div {
display:inline;
vertical-align:middle;
}
#directions ul#dir {
list-style:decimal;
}
#directions ul.dir-routes {
list-style: none;
}
.dir-va-mid {
vertical-align:middle;
}
强行添加CSS:
$("#directions div").css({'display':'inline', 'vertical-align':'middle'});
$("#directions ul#dir").css({'list-style':'decimal'});
$("#directions ul.dir-routes").css({'list-style':'none'});
$(".dir-va-mid").css({'vertical-align':'middle'});
编辑:我已经列入我的文件here。如果你有时间,请看看它。
请张贴一些代码。这听起来像你通过jQuery添加的元素根本不匹配你现有的CSS选择器。 – Dominic 2011-02-27 21:15:59
“一些”代码的概念似乎对每个人都不清楚:) – 2011-02-27 21:29:46