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


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 相关文章推荐
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
Apr 27 Javascript
我的Node.js学习之路(一)
Jul 06 Javascript
node.js中的path.normalize方法使用说明
Dec 08 Javascript
jQuery实现的简单排序功能示例【冒泡排序】
Jan 13 Javascript
clipboard.js在移动端复制失败的解决方法
Jun 13 Javascript
jQuery实现的页面弹幕效果【测试可用】
Aug 17 jQuery
微信小程序获取音频时长与实时获取播放进度问题
Aug 28 Javascript
React Hooks的深入理解与使用
Nov 12 Javascript
vue使用laydate时间插件的方法
Nov 14 Javascript
适合前端Vue开发童鞋的跨平台Weex的使用详解
Oct 16 Javascript
ng-alain的sf如何自定义部件的流程
Jun 12 Javascript
详解Vue.js 响应接口
Jul 04 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将XML转数组过程详解
2013/11/13 PHP
php中使用GD库做验证码
2016/03/31 PHP
php+ajax+json 详解及实例代码
2016/12/12 PHP
浅谈PHP发送HTTP请求的几种方式
2017/07/25 PHP
jQuery中filter()和find()的区别深入了解
2013/09/25 Javascript
JS中捕获console.log()输出的方法
2015/04/16 Javascript
javascript实现加载xml文件的方法
2015/11/24 Javascript
浅谈Sublime Text 3运行JavaScript控制台
2016/06/06 Javascript
BootStrap的select2既可以查询又可以输入的实现代码
2017/02/17 Javascript
bootstrap table动态加载数据示例代码
2017/03/25 Javascript
用js实现每隔一秒刷新时间的实例(含年月日时分秒)
2017/10/25 Javascript
webpack打包react项目的实现方法
2018/06/21 Javascript
vue devtools的安装与使用教程
2018/08/08 Javascript
layer.confirm取消按钮绑定事件的方法
2018/08/17 Javascript
JS基于Location实现访问Url、重定向及刷新页面的方法分析
2018/12/03 Javascript
extract-text-webpack-plugin用法详解
2019/02/14 Javascript
了解前端理论:rscss和rsjs
2019/05/23 Javascript
模块化react-router配置方法详解
2019/06/03 Javascript
vue本地打开build后生成的dist文件夹index.html问题
2019/09/04 Javascript
vue使用i18n实现国际化的方法详解
2019/09/05 Javascript
antd-日历组件,前后禁止选择,只能选中间一部分的实例
2020/10/29 Javascript
node.js通过Sequelize 连接MySQL的方法
2020/12/28 Javascript
python 简单的多线程链接实现代码
2016/08/28 Python
Atom的python插件和常用插件说明
2018/07/08 Python
Python生态圈图像格式转换问题(推荐)
2019/12/02 Python
Python生成词云的实现代码
2020/01/14 Python
纯css3制作煽动翅膀的蝴蝶的示例
2018/04/23 HTML / CSS
英国的潮牌鞋履服饰商店:size?
2019/03/26 全球购物
iKRIX意大利网上商店:男女豪华服装和配件
2019/10/09 全球购物
银行门卫岗位职责
2013/12/29 职场文书
骨干教师培训制度
2014/01/13 职场文书
秋季红领巾广播稿
2014/01/27 职场文书
网页美工求职信
2014/02/15 职场文书
个人投资合作协议书
2014/10/12 职场文书
投标邀请书范本
2015/02/02 职场文书
教你怎么用Python处理excel实现自动化办公
2021/04/30 Python