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


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 相关文章推荐
JS如何判断移动端访问设备并解析对应CSS
Nov 27 Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
Apr 27 Javascript
jquery实现鼠标点击后展开列表内容的导航栏效果
Sep 14 Javascript
Bootstrap每天必学之面板
Nov 30 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
Jul 18 Javascript
jQuery插件easyUI实现通过JS显示Dialog的方法
Sep 16 Javascript
Angular2 多级注入器详解及实例
Oct 30 Javascript
BootStrap表单控件之文本域textarea
May 23 Javascript
javaScript实现鼠标在文字上悬浮时弹出悬浮层效果
Apr 12 Javascript
VeeValidate在vue项目里表单校验应用案例
May 09 Javascript
BootStrap table实现表格行拖拽效果
Dec 01 Javascript
VUE:vuex 用户登录信息的数据写入与获取方式
Nov 11 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 返回数组后处理方法(开户成功后弹窗提示)
2017/07/03 PHP
php简单计算权重的方法示例【适合抽奖类应用】
2019/06/10 PHP
PHP实现的文件浏览器功能简单示例
2019/09/12 PHP
PHP实现基本留言板功能原理与步骤详解
2020/03/26 PHP
javascript 屏蔽鼠标键盘的几段代码
2008/01/02 Javascript
javascript 24小时弹出一次的代码(利用cookies)
2009/09/03 Javascript
javascript用户注册提示效果的简单实例
2013/08/17 Javascript
javascript实现简单的Map示例介绍
2013/12/23 Javascript
有效提高JavaScript执行效率的几点知识
2015/01/31 Javascript
详解Javascript模板引擎mustache.js
2016/01/20 Javascript
封装属于自己的JS组件
2016/01/27 Javascript
JS模态窗口返回值兼容问题的完美解决方法
2016/05/28 Javascript
原生js开发的日历插件
2017/02/04 Javascript
页面缩放兼容性处理方法(zoom,Firefox火狐浏览器)
2017/08/29 Javascript
用vue写一个仿简书的轮播图的示例代码
2018/03/13 Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
2018/09/03 jQuery
纯javascript前端实现base64图片下载(兼容IE10+)
2018/09/14 Javascript
实用Javascript调试技巧分享(小结)
2019/06/18 Javascript
JS防抖和节流实例解析
2019/09/24 Javascript
vue使用video插件vue-video-player的示例
2020/10/03 Javascript
python正则匹配查询港澳通行证办理进度示例分享
2013/12/27 Python
使用Python搭建虚拟环境的配置方法
2018/02/28 Python
Python 3.8正式发布重要新功能一览
2019/10/17 Python
Python使用matplotlib绘制Logistic曲线操作示例
2019/11/28 Python
python爬虫库scrapy简单使用实例详解
2020/02/10 Python
python 的numpy库中的mean()函数用法介绍
2020/03/03 Python
CSS3 简写animation
2012/05/10 HTML / CSS
世界上获奖最多的手机镜头:Olloclip
2018/03/03 全球购物
Omio葡萄牙:全欧洲低价大巴、火车和航班搜索和比价
2019/02/09 全球购物
比较基础的php面试题及答案-填空题
2014/04/26 面试题
事业单位考核材料
2014/05/21 职场文书
道歉短信大全
2015/05/12 职场文书
2015年高校保卫处工作总结
2015/07/23 职场文书
导游词之阆中古城
2019/12/23 职场文书
MySQL数据库压缩版本安装与配置详细教程
2021/05/21 MySQL
SQLServer之常用函数总结详解
2021/08/30 SQL Server