[原创]静态页面也可以实现预览 列表不同的显示方式


Posted in Javascript onOctober 14, 2006

为了方便查看内容,我特别加了个 预览 列表 两个列表显示方式
写于2006-10月,转载请写明出处 三水点靠木

//用于列表显示方式 
function changeshow(num){ 
var thenum=num,thestyle; 
if (num==1){ 
thestyle="none"; 
setCookie("num","1",6) 
var elements1=document.getElementsByTagName("div"); 
  for(var i=0;i<elements1.length;i++){ 
   if(elements1[i].id=='dxy'){ 
elements1[i].className='info2'; 
   } 
  } 
}else 
{ 
thestyle="" 
setCookie("num","0",6) 
var elements2=document.getElementsByTagName("div"); 
  for(var i=0;i<elements2.length;i++){ 
   if(elements2[i].id=='dxy'){ 
elements2[i].className='info'; 
   } 
  } 
} 
 var elements=document.getElementsByTagName("div"); 
  for(var i=0;i<elements.length;i++){ 
   if(elements[i].id=='3water'){ 
       if(elements[i].style.display!=thestyle){ 
        elements[i].style.display=thestyle; 
        } 
   } 
  } 
} function setCookie(name, value)        //cookies设置JS 
{ 
    var argv = setCookie.arguments; 
    var argc = setCookie.arguments.length; 
    var expires = (argc > 2) ? argv[2] : null; 
    if(expires!=null) 
    { 
        var LargeExpDate = new Date (); 
        LargeExpDate.setTime(LargeExpDate.getTime() + (expires*1000*3600*24)); 
    } 
    document.cookie = name + "=" + escape (value)+((expires == null) ? "" : ("; expires=" +LargeExpDate.toGMTString())); 
} 
function getCookie(Name)            //cookies读取JS 
{ 
    var search = Name + "=" 
    if(document.cookie.length > 0)  
    { 
        offset = document.cookie.indexOf(search) 
        if(offset != -1)  
        { 
            offset += search.length 
            end = document.cookie.indexOf(";", offset) 
            if(end == -1) end = document.cookie.length 
            return unescape(document.cookie.substring(offset, end)) 
         } 
    else return "" 
      } 
}

PS:
1、你的生成静态的文件中要有<div id=3water>字样,当然你也可以随意更改注意
上述代码中的var elements=document.getElementsByTagName("div"); 
代码
2、调用方法:

<script type=text/javascript language=javascript src="list.js"></script>

3、附poplist.js
try{ 
var dxynum=getCookie("num"); 
changeshow(dxynum); 
} 
catch(e){ }

具体应用:https://3water.com/html/list/list_1_1.htm
Javascript 相关文章推荐
JQuery 常用方法基础教程
Feb 06 Javascript
javascript 多种搜索引擎集成的页面实现代码
Jan 02 Javascript
用javascript判断IE版本号简单实用且向后兼容
Sep 11 Javascript
jquery的map与get方法详解
Nov 04 Javascript
jquery 绑定回车动作扑捉回车键触发的事件
Mar 26 Javascript
javaScript基础语法介绍
Feb 28 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
Mar 31 Javascript
使用JavaScript开发跨平台的桌面应用详解
Jul 27 Javascript
认识less和webstrom的less配置方法
Aug 02 Javascript
vue.js template模板的使用(仿饿了么布局)
Aug 13 Javascript
解决js相同的正则多次调用test()返回的值却不同的问题
Oct 10 Javascript
微信小程序日历效果
Dec 29 Javascript
动态加载js文件 document.createElement
Oct 14 #Javascript
不错的asp中显示新闻的功能
Oct 13 #Javascript
简单JS代码压缩器
Oct 12 #Javascript
jQuery 1.0.2
Oct 11 #Javascript
Firefox 无法获取cssRules 的解决办法
Oct 11 #Javascript
Google Suggest ;-) 基于js的动态下拉菜单
Oct 11 #Javascript
JS中style属性
Oct 11 #Javascript
You might like
php实现mysql备份恢复分卷处理的方法
2014/12/26 PHP
Laravel学习教程之从入口到输出过程详解
2017/08/27 PHP
ThinkPHP框架整合微信支付之Native 扫码支付模式二图文详解
2019/04/09 PHP
PhpStorm 如何优雅的调试Hyperf的方法步骤
2019/11/24 PHP
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
2012/12/12 Javascript
jquery获取元素索引值index()示例
2014/02/13 Javascript
js取整数、取余数的方法
2014/05/11 Javascript
jQuery找出网页上最高元素的方法
2015/03/20 Javascript
JavaScript中的对象继承关系
2016/08/01 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(二)
2017/01/21 Javascript
Vue.js父与子组件之间传参示例
2017/02/28 Javascript
Vue的Class与Style绑定的方法
2017/09/01 Javascript
微信小程序实现笑脸评分功能
2018/11/03 Javascript
微信小程序左滑删除功能开发案例详解
2018/11/12 Javascript
Python脚本处理空格的方法
2016/08/08 Python
django文档学习之applications使用详解
2018/01/29 Python
代码讲解Python对Windows服务进行监控
2018/02/11 Python
用Python shell简化开发
2018/08/08 Python
python 用opencv调用训练好的模型进行识别的方法
2018/12/07 Python
解决pycharm最左侧Tool Buttons显示不全的问题
2019/12/17 Python
Python抓包程序mitmproxy安装和使用过程图解
2020/03/02 Python
Python selenium键盘鼠标事件实现过程详解
2020/07/28 Python
python 装饰器的实际作用有哪些
2020/09/07 Python
Python爬虫简单运用爬取代理IP的实现
2020/12/01 Python
HTML 5 input placeholder 属性如何完美兼任ie
2014/05/12 HTML / CSS
AE美国鹰美国官方网站:American Eagle Outfitters
2016/08/22 全球购物
百联网上商城:i百联
2017/01/28 全球购物
英国最大的独立摄影零售商:Park Cameras
2019/11/27 全球购物
药剂专业学生求职信范文
2013/12/28 职场文书
财务会计专业个人求职信范本
2014/01/08 职场文书
党员违纪检讨书
2014/02/18 职场文书
工厂车间标语
2014/06/19 职场文书
地方课程教学计划
2015/01/19 职场文书
法律进社区活动总结
2015/05/07 职场文书
2016年9月份红领巾广播稿
2015/12/21 职场文书
html+css 实现简易导航栏功能
2021/04/07 HTML / CSS