版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進行舉報或認領(lǐng)
文檔簡介
1、如何修改aler樣式只能自定一個彈窗樣式首先必須明白的一點是,aler只是一個方法,而這個方法內(nèi)部是ate,這是我們無法修改的部分,而最終暴露的只有這個aler彷法名字而已,你甚至拿不到alert的屬性,因此要真正意義上的做到修改aler樣式是不可行的。有了以上這個條件基礎(chǔ),我們能做的只有重寫aler方法,替換掉系統(tǒng)自帶的aler方法。一行代碼替換alert方法alertt看到這,就有很多人已經(jīng)明了了,首先你可以先寫好一個假的彈窗樣式,然后通過這種方式顯示出來,這種是tl三方同時更改達到效果,你也可以全部都JaaSI去完成結(jié)構(gòu)樣式的操作,今天我們的示例就是全部通過來完成結(jié)構(gòu)樣式控制。明確了基本
2、方式是通過替換alert方法,那么就開始進一步的思考實現(xiàn)步驟。實現(xiàn)自定義alert方法的步驟確定彈窗樣式結(jié)構(gòu)結(jié)構(gòu)插入樣式控制點擊確定刪除結(jié)構(gòu)確定結(jié)構(gòu)aler容確定使用JS處理結(jié)構(gòu)于是有了下面這段代碼:alertalertalertataaratexta.a將l標簽插入外圍a.a將按鈕插入外圍reate創(chuàng)建:最外圍標簽reate創(chuàng)建me示內(nèi)容的標簽reate創(chuàng)建按n鈕標簽reate創(chuàng)縫一個文字節(jié)點ata確定te創(chuàng)建文字曲內(nèi)部結(jié)構(gòu)套入將需要顯示的內(nèi)容節(jié)點插入標簽內(nèi)l將按鈕文字插入按鈕標簽整/體顯示到頁面內(nèi)進行賦值,如果用這種方式寫的話,在就可改成這里為什么不直接用方法呢,這里考慮預編譯時并不會對之
3、前調(diào)用還會是系統(tǒng)自帶。當你初步調(diào)用時,如果不傳參數(shù)會報錯,那么我們需要一個的判斷,優(yōu)化當前的JSB接下來我們會發(fā)現(xiàn),我們還缺少樣式和確定關(guān)閉功能。這里完全可以用級事件綁定。代碼很快變成了這樣:確定內(nèi)部結(jié)構(gòu)套入整體顯示到頁面內(nèi)確/定綁定點擊事件刪除標簽樣式控制還剩下最后一個樣式控制問題。為了寫起來更美觀更方便,我們需要寫一個方法來控制樣式。這樣我們就可以通過如下方式控制樣式:retext-align”:“centerwaitwait,還沒完測試后發(fā)現(xiàn),如上的這種樣式書寫方式,下面有渲染問題,那我們換成。所以,樣式控制代碼改為.functioncss(targetO.varstr=targetOb
4、j.getttribute(style)?targetObj.getAttribute(style.for(variin.str+=i+bji+;targetObj.style.cext=str;這樣咱就解決的尷尬了,但是同時也帶來了其他問題,字符串拼接,有可能會出現(xiàn)重復屬性,因此如果你需要做一個通用的,還需要對字符串進行查重,但對于本例來說完全夠用了。完成版的aier功能我們的e就成了這樣(樣式還是自己調(diào)吧,下面的樣式只是做個示范)headetaarettitle學堂alerttitle/headwialertalerttialert(dataarareateElementreateElem
5、entreateElementt.extreateTexte(dataata控/制樣式itiixeleftrea確定ettop:20%,width:100px,margin:0auto,background-color:#f00,font-size:20px,text-align:center);css(btn,background:blue,)/內(nèi)部結(jié)構(gòu)套入p.appendChild(textNode);btn.appendChild(btnText);a.appendChild(p);a.appendChild(btn);/整體顯示到頁面內(nèi)document.getElementsByTag
6、Name(body)0.appendChild(a);/確定綁定點擊事件刪除標簽btn.onclick=functiona.parentNode.removeChild(a);functioncss(targetObj,cssObj)varstr=targetObj.getAttribute(style)?targetObj.getAttribute(style):for(variincssObj)str+=i+:+cssObji+;targetObj.style.cssText=str;alert(123);最后總結(jié)下,本例運用到的知識點,DOM操作、預編譯期與執(zhí)行、for-in盾環(huán),cssText。本文的主要目的在于引導思路,無論做什么項目,思路很重要,要懂得變通,如果你想通過某
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預覽,若沒有圖紙預覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負責。
- 6. 下載文件中如有侵權(quán)或不適當內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 2025年度跨境電商平臺合作推廣合同書4篇
- 二零二五年度花木種植與生態(tài)旅游合作合同3篇
- 2025年水鉆開洞施工質(zhì)量檢驗與驗收合同2篇
- 二零二五版文化創(chuàng)意產(chǎn)業(yè)技術(shù)入股合同范本3篇
- 二零二五年度車輛委托寄售合同
- 2025年度建筑節(jié)能工程監(jiān)理合同補充協(xié)議
- 二零二五年度化妝品零售銷售合同英文版
- 個人勞務服務合同2024版版B版
- 二零二五年度訂單農(nóng)業(yè)農(nóng)業(yè)廢棄物資源化利用合同
- 蘇州市物業(yè)管理2025年度居民關(guān)系協(xié)調(diào)合同3篇
- HG∕T 2058.1-2016 搪玻璃溫度計套
- 九宮數(shù)獨200題(附答案全)
- 泌尿科一科一品匯報課件
- 人員密集場所消防安全管理培訓
- 白銅錫電鍍工藝
- 拜耳法氧化鋁生產(chǎn)工藝
- 2024年南京信息職業(yè)技術(shù)學院高職單招(英語/數(shù)學/語文)筆試歷年參考題庫含答案解析
- 部編版二年級下冊道德與法治第二單元《我們好好玩》全部教案
- 幼兒園利劍護蕾專項行動工作方案總結(jié)與展望
- 合同信息管理方案模板范文
- 2024年大唐云南發(fā)電有限公司招聘筆試參考題庫含答案解析
評論
0/150
提交評論