重構(gòu)Javascript代碼示例(重構(gòu)前后對(duì)比)
更新時(shí)間：2013年01月23日 09:58:11 作者：
回顧頭來看看那些Javascript腳本，有寫得不太理想，過于復(fù)雜?，F(xiàn)抽取出來，重構(gòu)它們,想學(xué)習(xí)javascript重構(gòu)的朋友可以參考下啊，網(wǎng)本文可以幫助你的
今天有做了幾個(gè)asp.net結(jié)合Javascript的教程文章?，F(xiàn)回顧頭來看看那些Javascript腳本，有寫得不太理想，過于復(fù)雜?，F(xiàn)抽取出來，重構(gòu)它們。
之前一：
function SelectedAll(cb) {
cb.checked = cb.checked ? false : true;
var gv = document.getElementById('<%=GridViewCouplets.ClientID %>');
var rc = gv.rows.length;
for (var i = 1; i < rc; i++) {
var input = gv.rows[i].cells[0].getElementsByTagName("input");
if (input[0].type == "checkbox" && input[0].checked) {
input[0].checked = false;
gv.rows[i].style.backgroundColor = "";
}
else {
input[0].checked = true;
gv.rows[i].style.backgroundColor = "#66ff33;";
}
}
}
function SelectedSingle(cb) {
var row = cb.parentNode.parentNode;
if (cb.checked) {
row.style.backgroundColor = "#66ff33;";
}
else {
row.style.backgroundColor = "";
}
}
經(jīng)過重構(gòu)之后的Javascript腳本:
function SelectedAll(cb) {
var gv = document.getElementById('<%=GridViewCouplets.ClientID %>');
var rc = gv.rows.length;
for (var i = 1; i < rc; i++) {
var input = gv.rows[i].cells[0].getElementsByTagName("input");
if (input[0].type == "checkbox")
{
input[0].checked = cb.checked;
gv.rows[i].style.backgroundColor = input[0].checked ? "#66ff33;" :"";
}
}
}
function SelectedSingle(cb) {
var row = cb.parentNode.parentNode;
row.style.backgroundColor = cb.checked? "#66ff33;":"";
}
之前二：
function Check_Uncheck_All(cb) {
var cbl = document.getElementById("<%=CheckBoxListMusicType.ClientID%>");
var input = cbl.getElementsByTagName("input");
if (cb.checked) {
for (var i = 0; i < input.length; i++) {
input[i].checked = true;
}
}
else {
for (var i = 0; i < input.length; i++) {
input[i].checked = false;
}
}
}
重構(gòu)之后的Javascript腳本：
function Check_Uncheck_All(cb) {
var cbl = document.getElementById("<%=CheckBoxListMusicType.ClientID%>");
var input = cbl.getElementsByTagName("input");
for (var i = 0; i < input.length; i++) {
input[i].checked = cb.checked;
}
}
之前一：
復(fù)制代碼 代碼如下:
function SelectedAll(cb) {
cb.checked = cb.checked ? false : true;
var gv = document.getElementById('<%=GridViewCouplets.ClientID %>');
var rc = gv.rows.length;
for (var i = 1; i < rc; i++) {
var input = gv.rows[i].cells[0].getElementsByTagName("input");
if (input[0].type == "checkbox" && input[0].checked) {
input[0].checked = false;
gv.rows[i].style.backgroundColor = "";
}
else {
input[0].checked = true;
gv.rows[i].style.backgroundColor = "#66ff33;";
}
}
}
function SelectedSingle(cb) {
var row = cb.parentNode.parentNode;
if (cb.checked) {
row.style.backgroundColor = "#66ff33;";
}
else {
row.style.backgroundColor = "";
}
}
經(jīng)過重構(gòu)之后的Javascript腳本:
復(fù)制代碼 代碼如下:
function SelectedAll(cb) {
var gv = document.getElementById('<%=GridViewCouplets.ClientID %>');
var rc = gv.rows.length;
for (var i = 1; i < rc; i++) {
var input = gv.rows[i].cells[0].getElementsByTagName("input");
if (input[0].type == "checkbox")
{
input[0].checked = cb.checked;
gv.rows[i].style.backgroundColor = input[0].checked ? "#66ff33;" :"";
}
}
}
function SelectedSingle(cb) {
var row = cb.parentNode.parentNode;
row.style.backgroundColor = cb.checked? "#66ff33;":"";
}
之前二：
復(fù)制代碼 代碼如下:
function Check_Uncheck_All(cb) {
var cbl = document.getElementById("<%=CheckBoxListMusicType.ClientID%>");
var input = cbl.getElementsByTagName("input");
if (cb.checked) {
for (var i = 0; i < input.length; i++) {
input[i].checked = true;
}
}
else {
for (var i = 0; i < input.length; i++) {
input[i].checked = false;
}
}
}
重構(gòu)之后的Javascript腳本：
復(fù)制代碼 代碼如下:
function Check_Uncheck_All(cb) {
var cbl = document.getElementById("<%=CheckBoxListMusicType.ClientID%>");
var input = cbl.getElementsByTagName("input");
for (var i = 0; i < input.length; i++) {
input[i].checked = cb.checked;
}
}
相關(guān)文章
微信小程序?qū)崿F(xiàn)歷史搜索功能的全過程(h5同理)
最近在使用微信小程序開發(fā)的時(shí)候遇到了一個(gè)需求,需要實(shí)現(xiàn)歷史搜索記錄的功能,所以下面這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)歷史搜索功能(h5同理)的相關(guān)資料,需要的朋友可以參考下2022-12-12
這篇文章主要為大家詳細(xì)介紹了JavaScript表單驗(yàn)證開發(fā)的相關(guān)資料,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
這篇文章主要為大家分享介紹了JavaScript頭像上傳插件源碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-03-03
做過微信開發(fā)的都知道，在部分android機(jī)型里微信不支持網(wǎng)頁上傳圖片的，這是由于這些機(jī)型的文件上傳存在內(nèi)存泄漏，會(huì)導(dǎo)致微信閃退，所以微信內(nèi)置瀏覽器將文件上傳屏蔽，本篇文章給大家介紹使用微信jssdk如何上傳圖片，需要的朋友可以關(guān)注下2015-08-08
基于JavaScript實(shí)現(xiàn)圖片裁剪功能
在前端開發(fā)中，當(dāng)遇到圖片或頭像上傳等功能時(shí)，有尺寸分辨率限制的話，就需要用到圖片的裁剪功能。本文為大家介紹了JavaScript實(shí)現(xiàn)圖片裁剪功能的示例代碼，希望對(duì)大家有所幫助2023-02-02
js導(dǎo)出table數(shù)據(jù)到excel即導(dǎo)出為EXCEL文檔的方法
導(dǎo)出table為EXCEL文檔的方法有很多，在本文為大家介紹下js中時(shí)如何做到的，感興趣的朋友可以參考下2013-10-10
很久以前做網(wǎng)頁的時(shí)候，幾乎沒有聽說過 getElementById 這一玩意兒。在那個(gè)ie獨(dú)占天下的年代里，做的頁面也幾乎都是ie only的。只要ie沒問題，那就OK了2012-06-06
jquery的.click()點(diǎn)擊事件為什么無效，on('click',function())如何使
jquery的.click()點(diǎn)擊事件,通常都是可以正常使用的,有時(shí)選中的選擇器被點(diǎn)擊時(shí)無法觸發(fā)回調(diào)函數(shù),這是為什么呢？改成on綁定click就可以了嗎？面對(duì)這樣的情況,on('click',function())應(yīng)該如何使用？2023-08-08
這篇文章主要給大家介紹了關(guān)于微信小程序頁面間傳值的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04
js用Date對(duì)象的setDate()函數(shù)對(duì)日期進(jìn)行加減操作
在某個(gè)日期上加減天數(shù)來說，其實(shí)只要調(diào)用Date對(duì)象的setDate（）函數(shù)就可以了，具體方法如下2014-09-09