jQuery老黄历完整实现方法

本文实例讲述了框架老黄历实现方法。分享给大家供大家参考。具体实现方法分析如下：

先来看看程序运行效果：

超文本标记语言页面部分如下：

复制代码代码如下：DOCTYPE html html health eta http-equiv=' Content-TYPe ' Content=' text/html；charset=UTF-8'titlejquery老黄历特效-/title脚本id=' jquery _ 183 ' type=' text/JavaScript ' class=' library ' src=' http : js/jquery-1。8 .3 .量滴js '/script/head script type=' text/JavaScript ' class=' library ' src=' http : js/历书。js'/script/headlink rel='样式表href=' CSS/style。“CSS”类型=“文本/CSS”媒体程序员老黄历sup beta/sup/div class=' date '/div class=' good ' div class=' title ' RTD表宜/TD/tr/table/div class=' content ' ul/ul/div div class=' clear '/div/div class=' split '/div class=' bad ' div class=' title ' table RTD不宜/TD/tr/table/div class=' content ' ul/ul/div div class=' clear '/div/div class=' split '/div div class=' line-tip ' strong座位朝向：/strong面向span class=' direction _ value '/span写程序，BUG最少/divdiv class='line-tip'strong今日宜饮：/strong span class=' s饮料_价值/span/div class=' line-tip ' strong女神亲近指数：/strong span class=' goddes _ value '/span/div/div/body/html

style.css样式如下：

复制代码代码如下： body * { font-family : ' Consolas '，' Microsoft Yahei '，Arial，无衬线；}

正文{background:白色；保证金： 0；padd : 0；}。容器{ width: 320pxmargin: 0自动50px}。集装箱。标题{ color : # BBB字体粗细：粗体；边距-底部： 10px背景： # 555;padding: 5px 15px }。日期{ font-size :17 pt字体粗细：粗体；线高： 30磅；文本对齐：中心；}。分开。清除{clear:两者；高度： 1px溢出-y:隐藏；}。很好。坏{clear:两者；相对位置：}。坏的{/* top :-1px；*/}。很好。标题，糟糕。标题{左侧浮动：宽度： 100像素；字体粗细：粗体；文本对齐：中心；font-size : 30 pt位置：绝对；top:0底部：0;}。很好标题表.糟糕标题表{位置：绝对值；宽度：100%;高度：100%;border:none}。很好标题{ background: # ffee44}。糟糕标题{ background : # ff 4444 color : # fff }。很好。内容，糟糕。内容{左边距-: 115像素；填充-右： 10px衬垫-top : 1px；font-size :15 pt}。好{ background: # ffffaa}。错误的{ background: # ffddd3}。内容ul {list-style:无；余量：10px 0 0划水：0;}。内容ul Li {线高：150%；font-size : 15pt字体粗细：粗体；color: # 444}。内容ul Li分区。描述{ font-size : 10pt字体粗细：正常；颜色： # 777线高： 110%;边距-底部： 10px}。行提示{ font-size : 11pt页边距-top : 10px；左边距left: 10px}。direction _ value { color : # 4a 4；字体粗细：粗体；}。注释{ margin-top : 50px；font-size : 11pt左边距left: 10px}。注释ul { margin-left : 0；左填充left: 20pxcolor: # 999}

历书。射流研究…代码如下：

复制代码代码如下：/** 注意：本程序中的"随机"都是伪随机概念，以当前的天为种子*/function random(dayseed，index seed){ var n=day seed % 11117；for(var I=0；i 100指数种子；I){ n=n * n；n=n % 11117/是个质数}返回n；}

var today=new Date()；var iday=今日。getfullyear()* 10000(今天。getmonth()1)*今天100。getdate()；

Var周=['天'，'一'，'二'，'三'，'四'，'五'，'六']；Var方向=['北'，'东北'，'东'，'东南'，'南'，'西南'，'西'，'西北']；Var activities=[{name: '编写单元测试'，good: '编写单元测试会减少错误'，bad: '编写单元测试会降低你的开发效率' }，{name: '洗澡'，good3360 '你有多少天没洗澡了？bad: '会洗掉设计的灵感' }，{name: '锻炼身体'，good: ' '，bad: '不消耗太多能量，但多吃点' }，{name: '抽烟'，good: '抽烟对提神和增加精神敏捷有好处'，不好。{name: '白天上线'，good: '白天上线今天安全'，bad3360 '可能导致灾难性后果' }，{name: '重构'，good: '提高代码质量'，bad: '你很可能陷入泥潭' }，{name:Good: '你看起来更有品味'，bad: '别人会觉得你是在装逼' }，{name 3360 '跳槽'，good: '该放手的时候就放手'，bad: '鉴于目前的经济形势，你的下一份工作可能不会比现在更好' }，{name: '。Good:“你遇到Maxima的可能性大大增加”，bad:“你只会招一两个业余的”}，{name:“面试”，good:“面试官今天心情很好”，bad:“面试官会拿你出气”}，{name:“提交辞职申请。Good:“公司找到了一个比你更有能力更便宜的家伙，祝你快点离开这里”，bad:“鉴于目前的经济形势，你的下一份工作可能不会比现在更好了”}，{name:“申请加薪”，good:“老板今天心情很好”，bad:“公司正在考虑裁员”}，{。Good: '晚上是程序员最好的时间'，bad:''}，{name: '在女生面前吹牛'，good: '改善自己又矮又穷的形象'，bad: '会被抓' }，{name: '控制欲强'，good360。尝试戒烟，{name: '访问成人网站'，good: '重拾生活信心'，bad: '你会心烦意乱' }，{name3360 '命名变量\'% v \ '，good360 '，bad333。Good:“你的代码组织得很好，长一点没关系”，bad:“你的代码会很乱，你自己也看不懂”}，{name:“提交代码”，good:“遇到冲突的概率最低”，bad:“你遇到的很多冲突都会让你觉得时间是否过去”。{name: '代码审查'，good: '发现重要问题的概率大大增加'，bad: '你找不到任何问题，浪费时间' }，{name: '会议'，good3360 '写完代码后放松一下，打个盹对身体有好处'，bad: '你会没命的。{name: '玩DOTA '，good: '你会像上帝的帮助'，bad: '你会被严重虐待' }，{name: '晚上上网'，good3360 '晚上是程序员最好的时间'，bad3360 '白天累坏了' }，{name。Good: '你对bug的嗅觉今天有了很大的提升'，bad: '新bug会比修复的多' }，{name: '设计评审'，good: '设计评审会变成头脑风暴'，bad: '大家都筋疲力尽了，评审结束了' }，{name: '。Good: ' '，bad:'' }，{name: '去微博'，good: '今天发生的事不能错过'，bad: '老板会看到' }，{name: '去AB站'，good: '需要什么理由吗'，bad: '会被老板看到' }]；

varspecials=[{ date :20130221，type:' good '，name3360' anti-nuclear drill '，description: '万一疯子丢了核弹.'}];

Var工具=['Eclipse Writer '，' MSOffice Writer '，'记事本Writer '，' Windows 8 '，' Linux '，' Mac OS '，' IE '，' Android Device '，' iOS Device ']；

var varNames=['郭解'，'霍东'，'支付'，'到期'，'张丹'，'每'，'免费'，' i1 '，' a '，'虚拟'，' ad '，' spider '，' mima '，' pass '，' ui ']；

Var饮品=['水'，'茶'，'红茶'，'绿茶'，'咖啡'，'奶茶'，'可乐'，'牛奶'，'豆奶'，'果汁'，'果味汽水'，'苏打水'，'运动饮料'，'酸奶'，'。

函数getTodayString() {return '今天是today.getFullYear()'年(today.getMonth() 1)'月today.getDate()'日星期几周[今天。getday()]；}

//生成今日运势函数picktodayslack(){ var numgood=random(iday，98)% 3 ^ 2；var numBad=random(iday，87)% 3 2；var事件arr=pickrandomaactivity(NumGood NumBad)；var specialSize=pick specials()；for(var I=0；I numGoodI){ addToGood(eventar[I])；} for(var I=0；I numBadI){ AddToBad(event arr[NumGood I])；}}

//添加预定义事件函数pick special(){ var special size=[0，0]；for(var I=0；一、特色菜I){ var special=special[I]；if(iday==特殊。日期){ if(特殊。type==' good '){特殊尺寸[0]；addToGood({ name : special。名字，好：特价。描述})；} else { specialSize[1]；addToBad({ name : special。名字不好，特价。描述})；} } }返回specialSize}

//从活动中随机挑选大小个函数pickRandomActivity(大小){ var picked _ events=pickRandom(活动，大小);for(var I=0；我选择了_ events . lengthi){ pick _ events[I]=parse(pick _ events[I])；}返回picked _ events }

//从数组中随机挑选大小个函数pickRandom(数组，大小){ var result=[]；for(var I=0；i array.lengthI){ result。push(数组[I])；} for(var j=0；j数组。长度-大小；j ) {var index=random(iday，j)%结果。长度；结果.拼接(索引，1);}返回结果；}

//解析占位符并替换成随机内容函数解析（事件){ var result={ name : event。名字，好的：事件。好的，坏的：事件。坏的}；//克隆if(结果。名字。indexof("% v ")！=-1){结果。名称=结果。名字。替换(' % v '，varNames[random(iday，12)% varNames。长度])；} if(结果。名字。indexof("% t ")！=-1){结果。名称=结果。名字。替换(' % t '，工具[随机(iday，11)%工具。长度])；} if(结果。名字。indexof("% l ")！=-1){结果。名称=结果。名字。替换(' % l '，(random(iday，12) % 247 30).toString())；}返回结果；}

//添加到"宜函数addToGood(事件){$(')。很好。内容ul ').追加(' lidiv class=' name ' '事件。name '/div div class=' description '事件。好'/div/Li ')；}

//添加到"不宜函数addToBad(事件){$(')。糟糕。内容ul ').追加(' lidiv class=' name ' '事件。name '/div div class=' description '事件。错误'/div/Li ')；}

$(function(){$(').日期')。html(getTodayString())；$('.方向值').html(方向[随机(iday，2)%方向。长度])；$('.饮料_价值')。html(pickRandom(饮料，2)。join())；$('.goddes _ value’).html(random(iday，6)% 50/10.0)；pick todayslack()；});

希望本文所述对大家的jQuery程序设计有所帮助。