亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb

首頁 > 編程 > JavaScript > 正文

JavaScript中prototype為對象添加屬性的誤區介紹

2019-11-20 21:53:28
字體:
來源:轉載
供稿:網友
先上需要用到的全部代碼片段(截?。?
復制代碼 代碼如下:

MenuControl.prototype.boxDisplay = false;//是否顯示圖層選擇菜單
MenuControl.prototype.controlUI;
MenuControl.prototype.show = function(){
if(pointControl.boxDisplay){
pointControl.hide();
}
menuBoxDiv.style.display = "";
this.boxDisplay = true;
this.controlUI.style.backgroundColor = '#DDDDDD';
};
MenuControl.prototype.hide = function(){
menuBoxDiv.style.display = "none";
this.boxDisplay = false;
this.controlUI.style.backgroundColor = 'white';
};
//圖層選擇開關
function MenuControl(controlDiv, map) {
controlDiv.style.padding = '5px';
var controlUI = document.createElement('div');
this.controlUI = controlUI;
controlUI.style.backgroundColor = 'white';
controlUI.style.height = '18px';
controlUI.style.borderStyle = 'solid';
controlUI.style.borderWidth = '1px';
controlUI.style.cursor = 'pointer';
controlUI.style.textAlign = 'center';
controlUI.title = '點擊啟用菜單';
controlDiv.appendChild(controlUI);


var controlText = document.createElement('div');
controlText.style.fontFamily = 'Arial,sans-serif';
controlText.style.fontSize = '12px';
controlText.style.paddingLeft = '4px';
controlText.style.paddingRight = '4px';
controlText.innerHTML = '<strong>圖層選擇</strong>';
controlUI.appendChild(controlText);


google.maps.event.addDomListener(controlUI, 'click', function() {
if(menuControl.boxDisplay){
menuControl.hide();
}else{
menuControl.show();
}
});
}
//點開關框體
PointControl.prototype.boxDisplay = false;//是否顯示圖層選擇菜單
PointControl.prototype.controlUI;
PointControl.prototype.show = function(){
if(menuControl.boxDisplay){
menuControl.hide();
}
pointBoxDiv.style.display = "";
this.boxDisplay = true;
this.controlUI.style.backgroundColor = '#DDDDDD';
};
PointControl.prototype.hide = function(){
pointBoxDiv.style.display = "none";
this.boxDisplay = false;
this.controlUI.style.backgroundColor = 'white';
};
function PointControl(controlDiv, map) {
controlDiv.style.padding = '5px';


var controlUI = document.createElement('div');
this.controlUI = controlUI;
controlUI.style.backgroundColor = 'white';
controlUI.style.height = '18px';
controlUI.style.borderStyle = 'solid';
controlUI.style.borderWidth = '1px';
controlUI.style.cursor = 'pointer';
controlUI.style.textAlign = 'center';
controlUI.title = '點擊操控點菜單';
controlDiv.appendChild(controlUI);


var controlText = document.createElement('div');
controlText.style.fontFamily = 'Arial,sans-serif';
controlText.style.fontSize = '12px';
controlText.style.paddingLeft = '4px';
controlText.style.paddingRight = '4px';
controlText.innerHTML = '<strong>點</strong>';
controlUI.appendChild(controlText);


google.maps.event.addDomListener(controlUI, 'click', function() {
if(pointControl.boxDisplay){
pointControl.hide();
}else{
pointControl.show();
}
});
}

做的是谷歌的地圖應用,其中有右方有兩個div按鈕,通過點擊打開左方的div子菜單
 
要求是
 
打開前判斷該子菜單是否已經為打開狀態,如是,則先關閉,后打開

在開關子菜單時,按鈕會據相應行為變色

這里就要求在各個按鈕的show()方法下操作另一按鈕的屬性和方法來達到開關的效果

開始時寫成這樣
復制代碼 代碼如下:

MenuControl.prototype.controlUI;
MenuControl.prototype.show = function(){
controlUI.style.backgroundColor = '#DDDDDD';//直接調用屬性
};
function MenuControl(controlDiv, map) {
controlUI = document.createElement('div');
controlUI.style.backgroundColor = 'white';
}

結果無論開關哪一個菜單,都只有“點”按鈕變色

原因大概是controlUI莫名定義為全局變量了

后來我試圖這樣
復制代碼 代碼如下:

MenuControl.prototype.controlUI;
MenuControl.prototype.show = function(){
this.controlUI.style.backgroundColor = '#DDDDDD';//添加this關鍵字
};
function MenuControl(controlDiv, map) {
controlUI = document.createElement('div');
controlUI.style.backgroundColor = 'white';
}

結果還是失敗

后來我想通了,大概這樣就可以了
復制代碼 代碼如下:

MenuControl.prototype.controlUI.style.backgroundColor = "white";//一上來就給你賦值,看你往哪兒跑
MenuControl.prototype.show = function(){
this.controlUI.style.backgroundColor = '#DDDDDD';
};
function MenuControl(controlDiv, map) {
controlUI = document.createElement('div');
this.controlUI.style.backgroundColor = 'white';
}

這樣至少有錯誤信息了,不能給undefined添加style屬性什么的

于是我絕望了,準備給所有屬性也添加上全局變量,這樣調用就方便許多

沒成想,被自己啟發了

于是就有了最開始那段代碼
復制代碼 代碼如下:

MenuControl.prototype.controlUI;//先建立此屬性,挖一個坑
MenuControl.prototype.show = function(){
this.controlUI.style.backgroundColor = '#DDDDDD';//使用this關鍵字調用,實際調用的是this.controlUI對象
};
function MenuControl(controlDiv, map) {
var controlUI = document.createElement('div');//建立局部變量,并正常賦值
this.controlUI = controlUI;//將此局部變量反賦給this對象的屬性,達到關聯引用
controlUI.style.backgroundColor = 'white';//正常調用引用對象進行操控
}

這樣就將prototype添加的屬性和自身創建的局部變量關聯起來,使其可被外部其它對象所調用獲取

達到成功將同名屬性通過類對象進行區分并全局調用
發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
亚洲香蕉成人av网站在线观看_欧美精品成人91久久久久久久_久久久久久久久久久亚洲_热久久视久久精品18亚洲精品_国产精自产拍久久久久久_亚洲色图国产精品_91精品国产网站_中文字幕欧美日韩精品_国产精品久久久久久亚洲调教_国产精品久久一区_性夜试看影院91社区_97在线观看视频国产_68精品久久久久久欧美_欧美精品在线观看_国产精品一区二区久久精品_欧美老女人bb
成人h片在线播放免费网站| 久久久免费高清电视剧观看| 国产精品成人国产乱一区| 亚洲国产精品福利| 亚洲精品狠狠操| 中文字幕久精品免费视频| 国产美女搞久久| 91高潮精品免费porn| 欧美国产日韩一区二区在线观看| 伊人青青综合网站| 国产在线999| 成人黄色片在线| 国产亚洲a∨片在线观看| 视频在线观看99| 亚洲欧洲成视频免费观看| 欧美理论电影在线观看| 91探花福利精品国产自产在线| 97碰碰碰免费色视频| 精品一区二区三区四区在线| 国产欧美一区二区白浆黑人| 日韩成人在线播放| 欧美极品少妇xxxxⅹ喷水| 亚洲色图美腿丝袜| 亚洲国产欧美一区二区三区同亚洲| 日韩h在线观看| 欧洲美女免费图片一区| 久久久久久久久久国产| 黑人巨大精品欧美一区免费视频| 欧美高清视频在线| 欧美成人午夜激情| 亚洲国产天堂网精品网站| 国产美女直播视频一区| 亚洲欧洲av一区二区| 欧美成人午夜剧场免费观看| 精品国产福利视频| 久久久国产精品一区| 蜜臀久久99精品久久久无需会员| 色综合伊人色综合网| 亚洲美女av网站| 国产成人综合一区二区三区| 色综合久久悠悠| 一区二区三区回区在观看免费视频| 日韩中文在线不卡| 国产精品女主播视频| 国产精品第三页| 色与欲影视天天看综合网| 欧美肥臀大乳一区二区免费视频| 亚洲视频axxx| 91av成人在线| 日韩免费av在线| 日韩精品黄色网| 亚洲区中文字幕| 欧美日韩一区二区三区在线免费观看| 亚洲石原莉奈一区二区在线观看| 亚洲欧美日韩视频一区| 狠狠躁夜夜躁人人爽超碰91| 国产亚洲欧美日韩美女| 久久艹在线视频| 91九色国产在线| 亚洲xxxx视频| 亚洲老头老太hd| 亚洲va久久久噜噜噜| 国产日产欧美a一级在线| 一本一道久久a久久精品逆3p| 欧美激情三级免费| 亚洲91精品在线| 亚洲欧美变态国产另类| 久久久久久久久久久免费| 欧美大奶子在线| xx视频.9999.com| 亚洲成人999| 国产性色av一区二区| 欧美性猛交xxxx乱大交3| 午夜精品久久久久久久99热| 欧美性xxxx极品hd满灌| 韩国精品美女www爽爽爽视频| 欧美性极品xxxx做受| 国产高清在线不卡| 中文字幕精品—区二区| 国产日韩在线一区| 日韩中文有码在线视频| 亚洲最大成人网色| 久久大大胆人体| 精品少妇一区二区30p| 97在线视频观看| 亚洲精品乱码久久久久久按摩观| 欧美大全免费观看电视剧大泉洋| 日韩在线视频观看正片免费网站| 一区二区在线视频播放| 久久久久久久一区二区三区| 欧美激情视频网站| 成人av资源在线播放| 亚洲性线免费观看视频成熟| 中文字幕欧美专区| 热99精品里视频精品| 亚洲国产精品一区二区三区| 欧美性xxxxx| 亚洲午夜国产成人av电影男同| 蜜臀久久99精品久久久久久宅男| 久久精品99久久久久久久久| 日韩欧美中文字幕在线播放| 国产69久久精品成人看| 日韩大片在线观看视频| 亚洲欧美在线播放| 久久五月天色综合| 久久久久国产精品免费| 国产美女精品免费电影| 精品亚洲国产成av人片传媒| 久久综合网hezyo| 91精品国产综合久久男男| 久久精品色欧美aⅴ一区二区| 国产一区二区三区视频| 国产精品久久久久av| 国产成人综合av| 亚洲精品视频免费在线观看| 亚洲国产一区二区三区在线观看| 韩国国内大量揄拍精品视频| 国产精品久久久久久久久久99| 成人激情视频在线播放| 成人免费视频xnxx.com| 国产自摸综合网| 中文综合在线观看| 国产精品久久久久aaaa九色| 精品日本高清在线播放| 欧美一级视频一区二区| 久久精品国产亚洲7777| 成人午夜激情网| 国产一区二区三区精品久久久| 日韩精品在线免费观看视频| 久久久久久国产| 91免费福利视频| 国产精品久久久久久久av大片| 在线播放日韩av| 亚洲四色影视在线观看| 久久久国产影院| 国产精品第七影院| 欧美日韩成人在线观看| 亚洲成年网站在线观看| 奇米成人av国产一区二区三区| 欧美日韩国产成人| 国产日韩欧美在线| 国产成人精品在线视频| 国产精品午夜一区二区欲梦| 91a在线视频| 久久久精品国产亚洲| 欧美做爰性生交视频| 欧美猛男性生活免费| 亚洲综合精品一区二区| 亚洲自拍小视频免费观看| 成人亚洲综合色就1024| 国产精品成人av在线| 亚洲free性xxxx护士hd| 国产欧美日韩免费看aⅴ视频| 精品中文视频在线| 欧美专区日韩视频| 色综合久久88色综合天天看泰| 欧美网站在线观看| 欧美成人一区二区三区电影| 日本伊人精品一区二区三区介绍| 伊人亚洲福利一区二区三区| 午夜欧美大片免费观看| 亚洲а∨天堂久久精品喷水| 亚洲视频精品在线| 国产成人精品最新|