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

jh54 2014-09-05 08:54:49

如题，由于不习惯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>

...全文

294 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

jh54 2014-09-05

打赏
举报

问题解决了，我在用js加载div时，同时给它加了style：overflow: hidden;，显示就正常了，不明白为什么主页面外部引用的css文件中也有这句overflow: hidden;为什么会失效，还有那个margin属性也是一样，css文件里有也会失效，但是其他项图片显示字体大小颜色的属性又有效？？？？？求高手解答

jh54 2014-09-05

打赏
举报

这是正常预期的显示效果

这是ie的异常显示效果

frauzhou 2014-09-05

打赏
举报

引用 1 楼 yh850472175 的回复:

这是正常预期的显示效果这是ie的异常显示效果

id取值最好简单点，固定为同一值。然后设置命令，调用页面前，自动清空一次以前的cookie，再刷新页面。

frauzhou 2014-09-05

打赏
举报

引用 1 楼 yh850472175 的回复:

这是正常预期的显示效果这是ie的异常显示效果

引用 2 楼 yh850472175 的回复:

问题解决了，我在用js加载div时，同时给它加了style：overflow: hidden;，显示就正常了，不明白为什么主页面外部引用的css文件中也有这句overflow: hidden;为什么会失效，还有那个margin属性也是一样，css文件里有也会失效，但是其他项图片显示字体大小颜色的属性又有效？？？？？求高手解答

css的设置不对。你的css的设置里有两个情况对不上浏览器： 1.局部路径调用不一致，必须设定，不能用缺省；你的路径设置实在不行，就全部拷贝在同页面文件夹下，直接根目录调用。 2. 屏显要么你用了缺省设置。要么表格错位里，第二行里面的表格清理你没做，只是自动删除内容。或者删除了第二行第二列的前置格式表格。中间行在ie里变成缺省两端对齐的居中。