重构Javascript代码示例(重构前后对比)
更新时间：2013年01月23日 09:58:11 作者：
回顾头来看看那些Javascript脚本，有写得不太理想，过于复杂。现抽取出来，重构它们,想学习javascript重构的朋友可以参考下啊，网本文可以帮助你的
今天有做了几个asp.net结合Javascript的教程文章。现回顾头来看看那些Javascript脚本，有写得不太理想，过于复杂。现抽取出来，重构它们。
之前一：
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 = "";
}
}
经过重构之后的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;
}
}
}
重构之后的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;
}
}
之前一：
复制代码 代码如下:
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 = "";
}
}
经过重构之后的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;
}
}
}
重构之后的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;
}
}
您可能感兴趣的文章:
相关文章
这篇文章主要为大家详细介绍了JavaScript实现单图片上传并预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-09-09
本文为大家介绍了使用js弹出新页面同时避免被浏览器、ad拦截等，具体的实现方法如下，大家不妨参考参考2014-04-04
极致之美——百行代码实现全新智能语言...2007-03-03
由于前端开发的火热和一些IT巨头公司 对 web前端开发人员的需求旺盛，让越来越多的人转入前端。今天就为大家分享了一份Web前端开发书单，希望大家喜欢2017-10-10
javascript实现类似java中getClass()得到对象类名的方法
这篇文章主要介绍了javascript实现类似java中getClass()得到对象类名的方法,实例分析了javascript实现java中getClass方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
大家在淘宝购物之后，都会对卖家的服务进行评论，那么五星评价代码是怎么实现的呢？下面小编给大家介绍基于Javascript实现五星评价代码，有需要的朋友可以参考下2015-08-08
这篇文章主要教大家如何简单实现js上传文件功能，代码简单，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
这篇文章主要为大家详细介绍了小程序实现手写签名，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-07-07
这篇文章主要为大家详细介绍了JavaScript实现点击切换功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-01-01
本文通过源码给大家解析bootstrap进度条样式，分为条纹进度条，动态条纹进度条，层叠进度条和带Label的进度条，下面通过代码给大家简单介绍下，感兴趣的朋友一起看看吧2016-12-12
最新评论