当我在代码中使用appendChild()和createElement()时,不会应用定义的CSS ID的后续样式。有人可以告诉我为什么吗?这是我的代码:
function searchDone(results) {
var result = null;
var parent = document.getElementById('postWrap');
var child = null;
parent.innerHTML = '';
var insertHTML =" ";
//Paginating Results Links
resultNum = results.SearchResponse.Web.Total;
resultNum = resultNum/10;
child = document.createElement('div');
child.id = "paging";
if(results.SearchResponse.Web.Offset != 0){
insertHTML ='<span><a class="jsonp b" href="#" rev="'+(results.SearchResponse.Web.Offset-10)+'"><</a></span>';
}
if(results.SearchResponse.Web.Offset == 0){
insertHTML += '<span>1</span>';
}else{
insertHTML +='<span><a class="jsonp" href="#" rev="0">1</a></span>';
}
for(var i = 1; i <= resultNum; i++){
if((results.SearchResponse.Web.Offset/10) == i){
insertHTML += '<span>'+(i+1)+'</span>';
}else{
insertHTML += '<span><a class="jsonp b" href="#" rev="'+i*10+'">'+(i+1)+'</a></span>';
}
}
if(results.SearchResponse.Web.Total - results.SearchResponse.Web.Offset > 10){
insertHTML += '<span><a class="jsonp b" href="#" rev="'+(results.SearchResponse.Web.Offset+10)+'">></a></span>';
}
child.innerHTML = insertHTML;
parent.appendChild(child);
然后我有一些其他代码通过API将我的搜索查询处理到Bing(仅因为Google现在收费......)
接下来,我使用相同的方法插入另一个div:
//Insert Paginating results again
child = null;
child = document.createElement('div');
child.innerHTML = insertHTML;
child.id = "searchResultsPages";
parent.appendChild(child);
现在我想对这些数字应用一些样式。但是,当我将样式应用于searchResultsPage时,如
#searchResultsPages{
float: right;
}
我没有得到传递的风格。奇怪的是,如果我只插入这两个元素中的一个,一切都按计划进行,样式显示正常。问题是我喜欢在搜索的顶部和底部显示的页面。
为什么会发生这种情况?我认为它可能与使用两次的元素有关,但我不知道为什么如果对象不同会影响任何东西。
感谢。
答案 0 :(得分:4)
child.id = "searchResultsPages";
#searchResultsPage{
看到有什么不对吗? :)
喜欢s
答案 1 :(得分:1)
ID在页面中应该是唯一的,因此如果你有两个id =“searchResultsPage”的元素,行为可能会变得有点棘手,HTML无效。相反,如果有多个元素,请使用class =“searchResultsPage”。
其他评论者指出的失踪问题也很重要,但希望这只是问题中的一个错字。