首頁(yè) 猿問(wèn) 怎么封裝函數(shù)才不出BUG？

怎么封裝函數(shù)才不出BUG？

JavaScript

qq_輪滑到老_04284587 2017-09-03 17:29:55

這串代碼要怎么封裝才不出BUG，我的目的是在封裝以后在其他地方就不用重復(fù)寫(xiě)著段代碼了，求大神指導(dǎo)！<!DOCTYPE html><html><head>? ? <meta charset="UTF-8">? ? <title>實(shí)踐題 - 選項(xiàng)卡</title>? ? <style type="text/css">? ? ?/* CSS樣式制作 */ ?? ? ? ?*{padding:0px;margin:0px;font:12px normal "microsoft yahei";}? ? ? ?#tabs{width:290px;padding:5px;height:150px;margin:20px;}? ? ? ?#tabs ul{list-style:none;display:block;height:30px;line-height:30px;border-bottom:2px solid saddlebrown;}? ? ? ?#tabs ul li{float:left;background:#FFF;cursor:pointer;list-style:none;height:28px;line-height:28px;margin:0 3px;border:1px solid #aaaaaa;border-bottom:none;display:inline-block;width:60px;text-align:center;}? ? ? ?#tabs ul li.on{border-top:2px solid saddlebrown;border-bottom:2px solid #FFF;}? ? ? ?#tabs div{height:120px;line-height:25px;border:1px solid #336699;border-top:none;padding:5px;}? ? ? ?.hide{display:none;}? ? ? ?? ? </style>? ? <script type="text/javascript">? ? ? ? ?? ? // JS實(shí)現(xiàn)選項(xiàng)卡切換? ? ? window.onload = function(){? ? ? ? ? var oTab = document.getElementById("tabs");? ? ? ? ? var oUl = oTab.getElementsByTagName("ul")[0];? ? ? ? ? var oLis = oUl.getElementsByTagName("li");? ? ? ? ? var oDivs = oTab.getElementsByTagName("div");? ? ? ? ??? ? ? ? ? for(var i=0,len=oLis.length;i<len;i++){? ? ? ? ? ? ? oLis[i].index = i;? ? ? ? ? ? ? oLis[i].onclick = function(){? ? ? ? ? ? ? ? ? for(var n=0;n<len;n++){? ? ? ? ? ? ? ? ? ? ? oLis[n].className="";? ? ? ? ? ? ? ? ? ? ? oDivs[n].className="hide";? ? ? ? ? ? ? ? ? }? ? ? ? ? ? ? ? ? this.className="on";? ? ? ? ? ? ? ? ? oDivs[this.index].className="";? ? ? ? ? ? ? }? ? ? ? ? }? ? ? }? ??? ? </script>?</head><body>? <div id="tabs">? ? ? <ul>? ? ? ? ? <li>房產(chǎn)</li>? ? ? ? ? <li>家居</li>? ? ? ? ? <li>二手房</li>? ? ? </ul>? ? ? <div>? ? ? ? ? ?275萬(wàn)購(gòu)昌平鄰鐵三居總價(jià)20萬(wàn)買(mǎi)一居<br />? ? ? ? ? ?200萬(wàn)內(nèi)購(gòu)五環(huán)三居 140萬(wàn)安家東三環(huán)<br />? ? ? ? ? ?北京首現(xiàn)零首付樓盤(pán) 53萬(wàn)購(gòu)東5環(huán)50平<br />? ? ? ? ? ?京樓盤(pán)直降5000 中信府公園樓王現(xiàn)房<br />? ? ? </div>? ? ? <div>? ? ? ? ? ?40平出租屋大改造美少女的混搭小窩<br />? ? ? ? ? ?經(jīng)典清新簡(jiǎn)歐愛(ài)家 90平老房煥發(fā)新生<br />? ? ? ? ? ?新中式的酷色溫情 66平撞色活潑家居<br />? ? ? ? ? ?瓷磚就像選好老婆衛(wèi)生間煙道的設(shè)計(jì)<br />? ? ? </div>? ? ? <div>? ? ? ? ? ?通州豪華3居260萬(wàn) 二環(huán)稀缺2居250w甩<br />? ? ? ? ? ?西3環(huán)通透2居290萬(wàn) 130萬(wàn)2居限量搶購(gòu)<br />? ? ? ? ? ?黃城根小學(xué)學(xué)區(qū)僅260萬(wàn) 121平70萬(wàn)拋!<br />? ? ? ? ? ?獨(dú)家別墅280萬(wàn) 蘇州橋2居優(yōu)惠價(jià)248萬(wàn)<br />? ? ? </div>? </div>?</body></html>

查看完整描述

2 回答

遙望星辰_

TA貢獻(xiàn)119條經(jīng)驗(yàn) 獲得超85個(gè)贊

寫(xiě)代碼用不用jquery，用的話三兩行就搞定了，不用考慮什么封裝和bug問(wèn)題

反對(duì) 回復(fù) 2017-09-03

qq_輪滑到老_04284587
現(xiàn)在我還沒(méi)開(kāi)始學(xué)jquery，我現(xiàn)在先用JS進(jìn)行封裝函數(shù)，您可以用JS進(jìn)行封裝然后把代碼發(fā)給我看看嗎？謝謝！

回復(fù) 2017-09-04

橋本奈奈未

TA貢獻(xiàn)436條經(jīng)驗(yàn) 獲得超108個(gè)贊

將可變的信息用參數(shù)注入，然后將其封裝成工具函數(shù)或者構(gòu)造函數(shù)（或者說(shuō)叫類）。

個(gè)人不是很喜歡JS的類，尤其ES6之前是通過(guò)原型鏈來(lái)構(gòu)建的那種方式（雖然ES6也是這樣的，但是語(yǔ)法上更容易懂一點(diǎn)），JS的原型鏈比較錯(cuò)綜復(fù)雜，而且不用原型鏈也一樣可以玩的很溜。個(gè)人比較喜歡FP（函數(shù)式編程）那種。

反對(duì) 回復(fù) 2017-09-03