用js做了一个cookie显示用户访问记录,火狐显示没问题,ie显示异常

jh54 2014-09-05 09:24:06
如题,由于不习惯ie开发,不太好找到问题,求助各位大神!
代码在火狐上显示没为题,ie显示排列不整齐,另外ie的文档模式显示也没为题,我把最后客户端代码放在界面显示也没为题(文档模式和ie模式都没问题),求解,下面是相关代码:
css:


#main #right #cookies {
height: auto;
border: 1px solid #006600;
margin: 10px 2px 0px 2px;
}
#main #right #cookies #title3 {
background-color: #33CC00;
font-size: 14px;
font-weight: bold;
text-indent: 5px;
line-height: 25px;
}
#main #right #cookies #title4{
background-color: #33CC00;
font-size: 14px;
font-weight: bold;
text-align: center;
line-height: 25px;
}
#main #right #cookies #welcome{
font-size:15px;
font-weight:normal ;
text-indent:8px;
line-height:25px;
}
#main #right #cookies .cookies_book {
margin-top: 5px;
overflow: hidden;
margin-left: 0px;
display: block;
}
#main #right #cookies .cookies_book ul{
list-style:none;
margin:0px;
padding:0px;
}
#main #right #cookies .cookies_book li{
list-style:none;
margin:0px;
padding:0px;
}
#main #right #cookies img {
border: 1px solid #D3D3D3;
float: left;
height: 45px;
width: 45px;
margin: 0px 5px 4px 5px;
}



<div id="title3">
我的足迹
</div>
<div id="cookieslist">


</div>
<script type="text/javascript">
function getCookies(){//设置cookies
var cookieString=document.cookie.split(";");
if(cookieString.length>1){//判断是否有浏览图书的cookie,并对cookie拆分
var book_list=document.getElementById("cookieslist");
var d=0;
for(var i=cookieString.length-1;0<i<=cookieString.length;i--){//对cookie倒序输出
if(d>9) break;//最多只显示9条cookie浏览记录
d++;
var cStr=cookieString[i].split("="); //拆分名值对
var bookid=cStr[0]; //获取图书id
var str=cStr[1].split("_"); //对值进行拆分
if(str.length<5){ continue; }
var time=str[0];
var bookname=str[1];
var author=str[2];
var publish=str[3];
var img=str[4];
var b=add(bookid,bookname,author,publish,img,time);
book_list.appendChild(b);
}
}else{//没有图书浏览记录,显示欢迎语句
document.getElementById("title3").innerHTML="欢迎光临";
document.getElementById("title3").setAttribute("id","title4");
var text=document.createTextNode("祝您有一个愉快的购物体验!!");
var div_text=document.createElement("div");
div_text.setAttribute("id","welcome");
div_text.appendChild(text);
document.getElementById("cookieslist").appendChild(div_text);
}
}

function add(bookid,bookname,author,publish,img,time){
var bname=document.createTextNode(bookname);//书名
var author=document.createTextNode("作者:"+author);//作者
var publish=document.createTextNode("出版社:"+publish);//出版社

var div_book=document.createElement("div");
div_book.setAttribute("class","cookies_book");

var book_a=document.createElement("a");//插入图片链接
book_a.setAttribute("href","book?type=show&bookid="+bookid);
book_a.setAttribute("title",bookname);
var book_img=document.createElement("img");
book_img.setAttribute("border","0");
book_img.setAttribute("src",img);
book_a.appendChild(book_img);

var book_ul=document.createElement("ul");

var book_li_bookname=document.createElement("li");//插入书名
var book_a_name=document.createElement("a");
book_a_name.setAttribute("href","book?type=show&bookid="+bookid);
book_a_name.innerHTML=bookname;
book_li_bookname.appendChild(book_a_name);
book_ul.appendChild(book_li_bookname);

var book_li_author=document.createElement("li");//插入作者
book_li_author.appendChild(author);
book_ul.appendChild(book_li_author);

var book_li_publish=document.createElement("li");//插入出版社
book_li_publish.appendChild(publish);
book_ul.appendChild(book_li_publish);

div_book.appendChild(book_a);
div_book.appendChild(book_ul);
return div_book;
}
onload=function (){//获取cookies
getCookies();
}
</script>

...全文
73 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
jh54 2014-09-05
  • 打赏
  • 举报
回复
问题解决了,我在用js加载div时,同时给它加了style:overflow: hidden;,显示就正常了,不明白为什么主页面外部引用的css文件中也有这句overflow: hidden;为什么会失效,还有那个margin属性也是一样,css文件里有也会失效,但是其他项图片显示字体大小颜色的属性又有效?????
jh54 2014-09-05
  • 打赏
  • 举报
回复
再补充下,刚刚发现ie开发者工具有个查看类和id的功能,使用后其页面其他div的id都能显示但是通过js加载的这个不能,这是我的js编写有问题吗?
  • 打赏
  • 举报
回复
css hank
jh54 2014-09-05
  • 打赏
  • 举报
回复
这是正常预期的显示效果

这是ie的异常显示效果

87,914

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧