新人痛下决心，狠学前端，希望大家给予支持！_javascript吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：108,364贴子：
新人痛下决心，狠学前端，希望大家给予支持！收藏
大家好，我是新人，毕业后屡屡受挫的我今年已经20好几岁了，我不想父母再为我而担心，也不想就这么浪费青春，更不想再这么堕落下去，所以今天痛下决心，开始学习前端。很多人不喜欢学习，因为它太枯燥了，我也这么认为。男人就要对自己狠一点，但我一个人太弱了，我怕对自己不够狠，容易放松警惕，希望大家能够鼓励我，帮助我，监督我。本人新人，没有任何基础，所以找了一份大家公认还算靠谱的资料（不公布名称了，以免说我广告）从这一时刻开始每天坚持学习，希望大家多监督，支持！！从今天开始，每天看5集以上的视频，做练习，随后我会提交我的练习，希望大家多多批评！.
达内上海javascript,一般2-4周即可入门,先就业/先就业,后付款,0元试学,可以在线/现场免费试听!
你应该一看就是一天，一做题就是一天敲，5集算什么，真正学习的天天代码到凌晨。
希望你能坚持
加油　　　----当擦身而过的人已经不再属于你，是执着于悸动还是放下牵绊？
加油 我也是无基础 报了培训班 这个月开始学习
自学真心不易，真心希望朋友们帮我！第一天就看了这些视频，列表如下，但是做练习这个费劲。但最后终于满足了。JS入门教程-JS的热身上JS入门教程-JS的热身下1-JS中的HTML属性操作2-JS基础-属性操作实例3-JS基础-属性操作注意事项14-JS基础-属性操作注意事项25-JS基础-属性操作注意事项36-JS基础-条件判断做了一点笔记。1.学会了第一种获取元素的方式，document.getElementById(**);（ 好长的一段英文，痛苦，总打错）2.学会了几种JS事情命令，alert onclick onmouseover onmouseout. （其中alert用的最多，因为经常报错。哈哈）3.获取Html的属性读写操作，读方法（获取） 元素.属性名
元素.属性名 = 新的值操作元素属性时的一些注意事项：JS不能出现 “-”，用后面的第一个大写来代替。JS里允许把“.”换成[]innnerHTML的应用 要小心用innerHTMLfloat 靠class(我勒个X，这都什么啊，好难记住)5.声明以及应用变量 （这个简单）6.判断 if (){} if(){ if(){}else{}} ...（天书一样）自我感觉，虽然听天书，但是觉得还是挺有意思的。我做了两个课后练习：一个是：图片切换 。点顺序，只能从第一张到最后一张，点循环，可以最后一张跳到第一张。另一个是 ： 模拟手机发送短信。不同头像发送分别在左边和右边，并且要求由上方插入。 练习第一个截图是：
练习的第二个截图是：我写的代码见下：
请大家帮忙看看，小弟先行谢过！第一个是图片切换的代码：&!DOCTYPE HTML&&html&&head&&meta http-equiv=&Content-Type& content=&text/ charset=utf-8&&&title&妙味课堂视频自学练习-第1课-图片切换课后练习&/title&&style&* { margin:0; padding:0; list-style: }body { background:#f3f0 }#box { width:400 height:340 position: margin:0 border:10px solid #908D8D;}#box .prev { width:24 height:42 background:url(img/arrows.png) 0 0; position: left:-24 top:140 }#box .next { width:24 height:42 background:url(img/arrows.png) -76px 0; position: right:-24 top:140 }#box p { width:100%; height:40 line-height:40 text-indent:20 background:rgba(0,0,0,0.4); position: bottom:0; left:0; color:# font-size:14 }#bg { width:398 height:44 background:url(img/slider_nav_bg.png) no- background-size:100%; position: bottom:-45 left:6 } #box ol { width:100 height:20 position: bottom:0; left:144 z-index:999; padding-top:7 padding-left:40 }#box ol li { float: width:8 height:8 background:url(img/slider_nav_button.png); background-size:100%; float: margin-right:4 cursor: }#box ol .active { background:url(img/slider_nav_button.png) 0 -8 background-size:100%; }#btns { padding-top:30 text-align: height:100 position: }#btns a { display:inline- width:74 height:36 background:url(img/btn_bg.gif) 0 -41 text-align: line-height:36 text-decoration: color:#a9a9a9; }#btns a:hover { display:inline- width:74 height:36 background:url(img/btn_bg.gif); line-height:33 }#btns .active { color:#c2510d; }#btns p { width:100%; position: bottom:10 line-height:30
}#img1 {width:400 height:340}&/style&&script&window.onload = function(){var oPre = document.getElementById(*pre*);var oNex = document.getElementById(*nex*);var oPi = document.getElementById(*pi*);var oP = document.getElementById(*p1*);var oImg = document.getElementById(*img1*);var oBtn1 = document.getElementById(*btn1*);var oBtn2 = document.getElementById(*btn2*);var attrM = [*img/01.jpg*,*img/02.jpg*,*img/03.jpg*,*img/04.jpg*];var attrW = [*美味芝士蛋糕*,*烛光晚餐甜点*,*清新下午茶点*,*诱惑牛奶红茶*]var attrE = [*以下焦点图可从最后一张跳转到第一张循环切换*,*以下焦点图可从图只能到最后一张\或只能到第一张*];var num = 0;var oNoff =function fn1 (){oImg.src = attrM[num] ;oPi.innerHTML = attrW[num] ;};fn1 ();oBtn1.onclick = function(){oP.innerHTML = attrE[1];oBtn2.className = **;oBtn1.className = *active*;oNoff =};oBtn2.onclick = function(){oP.innerHTML = attrE[0];oBtn1.className = **;oBtn2.className = *active*;oNoff =};oNex.onclick = function(){num ++ ;if(num == attrM.length ){num = 0;if(oNoff){num = attrM.length-1;alert (*终于到最后一张了！*);} else {num = 0}}fn1 ();};oPre.onclick = function(){num -- ;if(num == -1 ){num = attrM.length-1;if (oNoff){num = 0;alert (*这是第一张啊亲！*);}else{num = attrM.length-1;}}fn1 ();};};&/script&&/head&&body&&div id=&btns&&&a id=&btn1& class=&active& href=&#&&顺序&/a&&a id=&btn2& href=&#&&循环&/a&&p id=&p1&&以下焦点图可从图只能到最后一张或只能到第一张&/p&&/div&&div id=&box&&&img id=&img1& src=&& /&&a id=&pre& class=&prev& href=&javascript:;&&&/a&&a id=&nex& class=&next& href=&javascript:;&&&/a&&p id=&pi&&图片一的说明&/p&&ol&&li class=&active&&&/li&&li&&/li&&li&&/li&&li&&/li&&/ol&&div id=&bg&&&/div&&/div&&/body&&/html&
第二个是 模拟手机发送的代码：&!DOCTYPE HTML&&html&&head&&meta http-equiv=&Content-Type& content=&text/ charset=utf-8&&&title&妙味课堂视频自学练习-第1课-模拟短信发送&/title&&style&#iPhone { width:256 height:536 background:url(img/iPhone.png) no- margin:0 position: }#text { width:206 height:316 position: top:78 left:21 padding:10px 0 10px 10 overflow: }#qq { position: left:28 bottom:86 }#message { padding:0; margin:0; width:122 height:21 padding:0 2 line-height:20 overflow: outline: position: left:61 bottom:86 font-size:12 font-family:*微软雅黑*; }a { width:42 height:24 position: right:24 bottom:86 }p { margin:0 0 5 font-size:12 font-family:*微软雅黑*; clear: position: padding:4 }.color1 { background:#e7e5 color:#252329; margin-right:40 float: left:30 }.color2 { background:#2bc71c; color:#f5 margin-right:30 float: }p img { position: top:0 }.color1 img { left:-28 }.color2 img { right:-28 }&/style&&script&window.onload = function(){var oText = document.getElementById(*text*);var oQq = document.getElementById(*qq*);var oMessage = document.getElementById(*message*);var oBtn = document.getElementById(*btn*);var oNoff =oQq.onclick = function (){if(oNoff){oQq.src = *img/qq1.gif*oNoff =} else {oQq.src = *img/qq2.gif*oNoff =}};oBtn.onclick = function (){if( oMessage.innerHTML ==**){alert(*写点啥吧亲！*);} else {if(oNoff){oText.innerHTML = *&p class=&color1&&&img src=&img/qq2.gif&/&说：* + oMessage.innerHTML + *&/p&* + oText.innerHTML;oMessage.innerHTML = **;}else{oText.innerHTML = *&p class=&color2&&&img src=&img/qq1.gif&/&说：* + oMessage.innerHTML + *&/p&* + oText.innerHTML; oMessage.innerHTML = **;}}};};&/script&&/head&&body&&div id=&iPhone&&
&div id=&text&&&/div&
&img id=&qq& src=&img/qq2.gif& /&
&div id=&message& contenteditable=&true&&&/div&
&a id=&btn& href=&javascript:;&&&/a&&/div&&/body&&/html&
楼主很强。。。支持你！给你一个名字:李强强（百度一下）
可以跟清楚的告诉你，看视频不如看书，
我已放弃js～
介绍一个慕课网给你，我个人觉得很强大，有练习还有视频
找个公司呆1年，什么都会了！
第一天就这么吊
不要急于题海和视频战术买本适合的书，一句句的咀嚼，一句句的敲，一句句的理解，比什么都好。视频上都是浅显的东西，没有书来的系统。编程这东西不可急躁，急躁情绪往往会漏学，也会降低思考深度。做为一个不算资深的前端给你这些建议
个人认为，多泡技术博客，看看大神们的编程心得是不错的，最近认识一个，你可以从他的一些心得中学到东西，然后确实如楼上所说，要看书，然后勤练，勤试错排错，乐于用不同方式和角度实现和解决问题。注意js细节，.cn可以帮你入入门，但是学深了会感觉它不太全面。视频个人感觉作用不是太大，耗时间且留给你的思考很有限。学js不在于你知道它多少语句和多少方法，而在于你会怎么用它们。个人意见，仅供参考。
学习学习！
学到for循环了，给自己个小鼓励，今天晚上吃炸酱面，加三个卤蛋。自学真心慢啊。但是很有有意思。看到大家的建议和鼓励，个人真心感谢。如二楼前辈所说，要加倍努力，现在一次看10集，消化完了再继续。感谢大家给我的建议！视频看到这了。1-动态方法：ByTagName()2-ByTagName动态方法特性3-初识for循环4-for循环执行顺序5-for应用：选取、生成、性能6-for循环生成坐标7-for循环遍历2维数组、嵌套元素8-cssText文本格式化与属性操作9-综合实例：生成一组新闻及思路分析10-this指向及this应用1.学会了第二种获取元素的方式，document.getElementsByTagName(**)[0];（ 我勒个去，更长了，错的更多了。）2.for（）{}（）天书又来了。添加东西的时候要注意，先清空在循环，或者判断，要不，无限加3. document.getElementByTagName(**); 可以动态找到元素。（真心佩服js的牛人，这全局观，5颗星）4.cssText （直接写啊，舒服）5.可以在JS添加标签时写style的样式。但是要注意。（这方便是方便，但是一个小错就坑爹了，经常落下空格，然后找半天错。苦逼）6.this (现在还没搞清楚，太闹心了。)做了两个小练习。第一个：在文档中插入100个DIV，然后用背景拼成大图。第二个：插入N个标签，然后做成99乘法表。图片见下：
第一个练习是：100个DIV拼背景图。请大家帮忙看看。代码是：&!doctype html&&html&&head&&meta charset=&utf-8&&&title&妙味课堂视频自学练习-第2课-for循环生成100个div课后练习&/title&&/head&&style&#box { margin:30px auto 0 ; width:520 height:520 border:10px solid #877D7E; position:background:url(img/11.jpg); background-size:520px 520 z-index:1;}#box div { width:50 height:50 background:#494343; filter:alpha(opacity=90); opacity: 0.9; border:1px solid #F1EEEE; position: top:0; left:0; text-align: line-height:50 font-size:20 color:# background:url(img/9.jpg) ; z-index:3;}&/style&&script&window.onload = function(){var oDiv = document.getElementById(*box*);var j=-1;for (var i=0; i&100; i++){oDiv.innerHTML += *&div&*+ i + *&/div&*;}var aDiv = oDiv.getElementsByTagName(*div*);for (var i=0; i&aDiv. i++){if( i%10==0){j++;}aDiv[i].style.left =52*(i%10) + *px*;aDiv[i].style.top = 52*j + *px*;aDiv[i].style.backgroundPosition = -52*(i%10) + *px * + -52*j + *px*;}for (var i=0; i&aDiv.i++){aDiv[i].onmouseover = function(){this.style.display = *none*;};}};&/script&&body&&div id=&box&&&/div&&/body&&/html&第二个练习是： 插入N个标签，做成99乘法表代码是：&!doctype html&&html&&head&&meta charset=&utf-8&&&title&妙味课堂视频自学练习-第2课-for循环生成99乘法表课后练习&/title&&/head&&style&#boxa { position: width: 800 height:500 background:url(img/16.jpg) no- background-size: 100% 100%; border:1 left:480 top:40}#box { position: width:558 height:286 margin:100 left:125
}span { position: top:0; left:0; width:60 height:30 line-height:40 text-indent:6 border:1 color:# font-size:15}&/style&&script&window.onload = function(){var oDiv = document.getElementById(*box*);var sHtml = **;for (var i=0; i&10; i++){var itop = 32*(i-1);for(var j=1; j&=i; j++){var ileft = 62*(j-1);sHtml += *&span style=&top:*+itop+* left:*+ileft+* background-color:rgb(*+(j*20)+*,*+(i*20)+*,*+(i*j)+*)&&*+i+***+j+*=*+(i*j)+*&/span&*; //这太容易写错了。要么少个引号，要么少个+号，要么少个空格，找错误找的我快死掉了}}oDiv.innerHTML += sHvar aSpan = oDiv.getElementsByTagName(*span*);for(var i=0; i&aSpan. i++){aSpan[i].onmouseover = function(){this.style.color = this.style.backgroundCthis.style.backgroundColor = *#fff*;};}for(var i=0; i&aSpan. i++){aSpan[i].onmouseout = function(){this.style.backgroundColor = this.style.this.style.color = *#fff*;};}};&/script&&body&&div id=&boxa&&&div id=&box&&&/div&&/div&&/body&&/html&
先学的jQuery 回头学js lz能加下q么 共同学习
不要先学jq，先把js学好，jq什么的都很简单
真心感谢各位朋友热心帮助我，给我建议，帮我成长。 真是人间只有真情在。这两天做的练习，卡住了，希望大家帮帮我，小弟先行谢过。和以往一样。视频我继续看了这些：1-自定义属性、自定义一组开关应用-12-获取自身递增数字及匹配数组内容-23-添加索引值、匹配数组、HTML元素-34-图片切换综合实例1：布局-45-图片切换综合实例2：数据与初始化-56-图片切换实例3：2种图片切换思路-67-图片切换实例4：代码简化、函数合并-78-QQ菜单实例1：实现折叠与展开-89-QQ菜单实例2：实现点击高亮显示、3道作业要求-9天书笔记1.自定义属性，可以个标签添加自定义的属性并赋值。可以制定索引，制定开关。2.this的储存，方便合并。（但是对于合并代码，真心不懂，那个大神能帮我啊。告诉我一些技巧。谢谢了。）3.找到各层元素需要for套for（第二个for是为了加事件） 但元素复杂的情况下，先存储，方便后续操作。所以，第二个for不加事件，先存在数组里 （估计只有我自己能看懂，或者说，以后我自己都看不懂。开始不懂为什么，强背吧。阿门！~）4.arrLi.push(aLi[j]);往数组里塞元素。方法。数组名.push(元素名); (好吧！和它拼了。)做了三个练习第一个：QQ列表第二个：for循环切换图片第三个：一组按钮，控制两组图片，图片可以单独切换。（我了个亲娘嘞！我这么说能听明白么）
第一个：QQ列表这个简单代码是：&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &&&&html xmlns=&&&&head&&meta http-equiv=&Content-Type& content=&text/ charset=utf-8& /&&title&妙味课堂视频自学练习-第3课-QQ列表课后练习&/title&&style&*{ margin:0; padding:0; list-style: font-family:&微软雅黑&;}#friend{ width:300 margin:50px auto 0; border-left:1px solid # border-right:1px solid #}#friend h2{ width:270 height:35 line-height:35 padding-left:30 background:url(img/ico1.gif) 10px no-repeat #74a400; color:# font-size:16 font-weight:100; cursor:}#friend h2.hover{ background:url(img/ico2.gif) 10px no-repeat #74a400;}#friend li{ margin-bottom:1}#friend li ul li{ width:270 padding-left:30 height:30 line-height:30 border-bottom:1px solid # cursor:}#friend li ul .hover{ background:#EFF4E0;}#friend li ul .active{ background:#FFC;}#friend li ul{ display:}#friend li ul.hover{ display:}&/style&&script&window.onload = function(){var oFriend = document.getElementById(*friend*);var aH2 = oFriend.getElementsByTagName(*h2*);var aUl = oFriend.getElementsByTagName(*ul*);var aLi =var arrLi = [];for(var i=0; i&aH2. i++){aH2[i].index =aH2[i].onOff =aH2[i].onclick = function(){if(this.onOff==true){aUl[this.index].style.display = *block*;//如果想上一个收起来，可以先Ul全部隐藏，在显示。多一个for循环this.className = *hover*;this.onOff =} else{aUl[this.index].style.display = *none*;this.className = **;this.onOff =}};}for(var i=0; i&aUl. i++){aLi = aUl[i].getElementsByTagName(*li*);for(var j=0; j&aLi. j++){arrLi.push(aLi[j]);}}for(var i=0; i&arrLi. i++){arrLi[i].onclick = function(){if (this.className == **){for(var i=0; i&arrLi. i++){arrLi[i].className = **;}this.className = *active*;} else{this.className = **;}};}};&/script&&/head&&body&&ul id=&friend&&&li&
&h2&我的好友&/h2&
&li&王一一&/li&
&li&李文化&/li&
&li&高发展&/li&
&h2&我的同事&/h2&
&li&黄腾达&/li&
&li&刘和谐&/li&
&li&邢如意&/li&
&li&沈从文&/li&
&li&张曼玉&/li&
&h2&我的同学&/h2&
&li&郭文明&/li&
&li&尹调整&/li&
&li&郑安全&/li&
&/li&&/ul&&/body&&/html&
第二个：for循环切换图片这个就有点被打蒙了。要求点下面的小点（ol里的li）先显示缩略图，然后点击li才替换到大图，并且，要求左右的上一张，和下一张（a标签）要和 小点（ol里的li）同步。（我了个亲娘，弄死我了）现在还没弄明白，希望大神帮忙看看是哪有问题。或者思路是什么，感谢！代码是：&!DOCTYPE HTML&&html&&head&&meta http-equiv=&Content-Type& content=&text/ charset=utf-8&&&title&妙味课堂视频自学练习-第3课-for循环this图片切换课后练习&/title&&style&* { margin:0; padding:0; list-style: }body { background:#f3f0 }#box { width:600 height:340 position: margin:0 border:10px solid #908D8D;}#box .prev { width:24 height:42 background:url(img/arrows.png) 0 0; position: left:-24 top:140 }#box .next { width:24 height:42 background:url(img/arrows.png) -76px 0; position: right:-24 top:140 }#box p { width:100%; height:40 line-height:40 text-indent:20 background:rgba(0,0,0,0.4); position: bottom:0; left:0; color:# font-size:14 }#bg { width:598 height:44 background:url(img/slider_nav_bg.png) no- background-size:100%; position: bottom:-45 left:6 } #box ol { width:100 height:20 position: bottom:0; left:244 z-index:999; padding-top:7 padding-left:40
}#box ol li { float: width:8 height:8 background:url(img/slider_nav_button.png); background-size:100%; float: margin-right:4 cursor: }#box li span { width:100 height:80 position: top:-80 left:12 border:1px solid #E8E1E1; display:}#box li span img { width:100 height:80 }#box ol .active { background:url(img/slider_nav_button.png) 0 -8 background-size:100%; }#btns { padding-top:30 text-align: height:100 position: }#btns a { display:inline- width:74 height:36 background:url(img/btn_bg.gif) 0 -41 text-align: line-height:36 text-decoration: color:#a9a9a9; }#btns a:hover { display:inline- width:74 height:36 background:url(img/btn_bg.gif); line-height:33 }#btns .active { color:#c2510d; }#btns p { width:100%; position: bottom:10 line-height:30
}#img1 {width:600 height:340}&/style&&script&window.onload = function(){var oPre = document.getElementById(*pre*);var oNex = document.getElementById(*nex*);var oPi = document.getElementById(*pi*);var oP = document.getElementById(*p1*);var oImg = document.getElementById(*img1*);var oBtn1 = document.getElementById(*btn1*);var oBtn2 = document.getElementById(*btn2*);var oBox = document.getElementById(*box*);var oOl = oBox.getElementsByTagName(*ol*)[0];var aOli = oBox.getElementsByTagName(*li*);var aSpan = oBox.getElementsByTagName(*span*);var attrM = [*img/01.jpg*,*img/02.jpg*,*img/03.jpg*,*img/04.jpg*];var attrW = [*妹妹一*,*妹妹二*,*妹妹三*,*妹妹四*]var attrE = [*以下焦点图可从最后一张跳转到第一张循环切换*,*以下焦点图可从图只能到最后一张\或只能到第一张*];var num = 0;var oNoff =var aImg =var arrImg = [];for(var i=0; i&aSpan. i++){aSpan[i].innerHTML = *&img src=&&/&*;}for( var i=0; i&aSpan. i++){aImg = aSpan[i].getElementsByTagName(*img*);for(var j=0; j&aImg. j++){aImg[j].src = attrM[i];}}fn1 ();for (var i=0; i&aOli. i++){aOli[i].index =aOli[i].onmouseover = function(){for(var i=0; i&aOli. i++){aOli[i].className = **;}this.className = *active*;aSpan[this.index].style.display = *block*;num=this.//有错误，缩略图直接替换掉了，能否不替换，点li的时候替换，鼠标移入只显示缩略图 太恶心了。弄死};aOli[i].onmouseout = function(){aSpan[this.index].style.display = *none*;fn1 ();};aOli[i].onclick = function(){oImg.src = attrM[this.index] ;fn1 ();};}oBtn1.onclick = function(){oP.innerHTML = attrE[1];oBtn2.className = **;oBtn1.className = *active*;oNoff =};oBtn2.onclick = function(){oP.innerHTML = attrE[0];oBtn1.className = **;oBtn2.className = *active*;oNoff =};oNex.onclick = function(){ num ++ ;if(num == attrM.length ){num = 0;if(oNoff){num = attrM.length-1;alert (*终于到最后一张了！*);} else {num = 0}}fn1 ();};oPre.onclick = function(){num -- ;if(num == -1 ){num = attrM.length-1;if (oNoff){num = 0;alert (*这是第一张啊亲！*);}else{num = attrM.length-1;}}fn1 ();};function fn1 (){oImg.src = attrM[num] ;oPi.innerHTML = attrW[num] ;};};&/script&&/head&&body&&div id=&btns&&&a id=&btn1& class=&active& href=&#&&顺序&/a&&a id=&btn2& href=&#&&循环&/a&&p id=&p1&&以下焦点图可从图只能到最后一张或只能到第一张&/p&&/div&&div id=&box&&&img id=&img1& src=&& /&&a id=&pre& class=&prev& href=&javascript:;&&&/a&&a id=&nex& class=&next& href=&javascript:;&&&/a&&p id=&pi&&图片一的说明&/p&&ol&&li&
&span&&/span&
&span&&/span&
&span&&/span&
&span&&/span&
&/li&&/ol&&div id=&bg&&&/div&&/div&&/body&&/html&
第三个练习：一组按钮，控制两组图片，图片可以单独切换。（我了个亲娘嘞！我这么说能听明白么） 这个效果是做出来了。但是好繁琐，我觉得可以用for循环写出来可能稍微少一点代码，但是不会，希望大家帮我！能否请教大神，传授我合并代码的方法，或者是思路。&!DOCTYPE HTML&&html&&head&&meta http-equiv=&Content-Type& content=&text/ charset=utf-8&&&title&妙味课堂视频自学练习-第3课-控制两组图片课后练习&/title&&style&p, ul, h2 { padding:0; margin:0; }li { list-style: }#box { width:1000 height:600 margin:0 background:url(img/bg.jpg); position: }#box p,#box ul { position: left:127 }#box p { top:80 }#box p a { text-decoration: font-family:微软雅黑; font-size:11 color:#333; float: background:url(img/next.gif); width:66 height:18 overflow: text-align: margin-right:10 }#box ul { top:136 }#box ul li { float: margin-right:62 }#box h2, #box span { text-align: font-family:微软雅黑; font-size:12 color:#333; }&/style&&script&window.onload = function(){var oDiv = document.getElementById(*box*);var oPrev = oDiv.getElementsByTagName(*a*)[0];var oNext = oDiv.getElementsByTagName(*a*)[1];var aLi = oDiv.getElementsByTagName(*li*);var oImg1 = oDiv.getElementsByTagName(*img*)[0];var oImg2 = oDiv.getElementsByTagName(*img*)[1];var oh21 = oDiv.getElementsByTagName(*h2*)[0];var oh22 = oDiv.getElementsByTagName(*h2*)[1];var oSpan1 = oDiv.getElementsByTagName(*span*)[0];var oSpan2 = oDiv.getElementsByTagName(*span*)[1];var arrUrl1 = [ *img/a1.jpg*,*img/a2.jpg*,*img/a3.jpg*,*img/a4.jpg* ];var arrUrl2 = [ *img/a5.jpg*,*img/a6.jpg*,*img/a7.jpg*];var arrText1 = [ *第一组第1张*,*第一组第2张*,*第一组第3张*,*第一组第4张* ];var arrText2 = [ *第二组第1张*,*第二组第2张*,*第二组第3张*];var num = 0;var numm = 0function ftab1(){oImg1.src = arrUrl1[num];oh21.innerHTML = arrText1[num]; oSpan1.innerHTML = 1 + num + */* + arrUrl1.};function ftab2(){oImg2.src = arrUrl2[numm];oh22.innerHTML = arrText2[numm]; oSpan2.innerHTML = 1 + numm + */* + arrUrl2.};ftab1();ftab2();function fNext1(){num ++;if (num ==arrUrl1.length){num = 0;}ftab1();};function fNext2(){numm ++;if (numm ==arrUrl2.length){numm = 0;}ftab2();};oImg1.onclick = fNext1;oImg2.onclick = fNext2;oPrev.onclick = function(){fNext1 ();fNext2 ();};oNext.onclick = function(){fNext1 ();fNext2 ();};};
//我了个X，这我自己写的，自己看了都想吐&/script&&/head&&body&&div id=&box&&&p&&a href=&javascript:;&&上一组&/a&&a href=&javascript:;&&下一组&/a&&/p&&ul&&li&&img src=&& /&&h2&...&/h2&&span&...&/span&&/li&&li&&img src=&& /&&h2&...&/h2&&span&...&/span&&/li&&/ul&&/div&&/body&&/html&
哈彼此春柳陌路人尤文图斯突听咯哦
登录百度帐号推荐应用
为兴趣而生，贴吧更懂你。或}