JavaScript學習筆記4 點擊鏈接打開新窗口

html部分

    <!-- 兩種形式境氢,第一種是直接控制A標簽的點擊事件觸發(fā)读恃,第二種是給帶某個固定class的A標簽添加事件 -->
    <a  onclick="winLink(this); return false">open</a>
    <a  class="open">open</a>

Javascipt部分一

創(chuàng)建一個winlink函數(shù)搏屑,第一種形式就是直接調用這段JS打開新窗口的低缩。

    function winLink(link){
        window.open(link,"新窗口名稱",width=300,heiht=400);
    }

Javascipt部分二

第二種形式的JS堪旧,要結合Javascipt部分一一起使用

    //獲取頁面中的所有A標簽
    var links = document.getElementsByTagName("a");
    
    for(var i=0;i<links.length;i++){
    
    //判斷A標簽的class是否為"open"
        if(links[i].getAttribute("class") == "open"){
        
        //如果是糠雨,給這個A標簽的onclick綁定一個帶語句的函數(shù)(這個是我一個文科生的理解才睹,書上沒有注明)
            links[i].onclick = function(){
            
                //查找這個A標簽內的"href"屬性,并把這個值賦值給函數(shù)winlink的屬性"link"
                winLink(this.getAttribute("href"));return false;
            }
        }
    }

以上js最好放置在body最下方甘邀,以免出現(xiàn)JS比HTML先讀取完導致獲取標簽失效

外部JS文件

外部JS文件還可以添加一個函數(shù)避免讀取順序上的問題:

    //窗口加載完畢后執(zhí)行函數(shù)prepareLinks
    window.onload = prepareLinks;
    function prepareLinks(){
        ....
        //上面的JS第一部分和第二部分放在這個函數(shù)內
    }

沒有太多說明琅攘,注釋已經比較清楚的了,第一次學習javascipt松邪,難免有些地方寫的不夠好甚至寫錯的坞琴,還請多多指教!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末测摔,一起剝皮案震驚了整個濱河市置济,隨后出現(xiàn)的幾起案子解恰,更是在濱河造成了極大的恐慌,老刑警劉巖浙于,帶你破解...
    沈念sama閱讀 211,123評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件护盈,死亡現(xiàn)場離奇詭異,居然都是意外死亡羞酗,警方通過查閱死者的電腦和手機腐宋,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,031評論 2 384
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來檀轨,“玉大人胸竞,你說我怎么就攤上這事〔翁眩” “怎么了卫枝?”我有些...
    開封第一講書人閱讀 156,723評論 0 345
  • 文/不壞的土叔 我叫張陵,是天一觀的道長讹挎。 經常有香客問我校赤,道長,這世上最難降的妖魔是什么筒溃? 我笑而不...
    開封第一講書人閱讀 56,357評論 1 283
  • 正文 為了忘掉前任马篮,我火速辦了婚禮,結果婚禮上怜奖,老公的妹妹穿的比我還像新娘浑测。我一直安慰自己,他們只是感情好歪玲,可當我...
    茶點故事閱讀 65,412評論 5 384
  • 文/花漫 我一把揭開白布迁央。 她就那樣靜靜地躺著,像睡著了一般滥崩。 火紅的嫁衣襯著肌膚如雪漱贱。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,760評論 1 289
  • 那天夭委,我揣著相機與錄音,去河邊找鬼募强。 笑死株灸,一個胖子當著我的面吹牛,可吹牛的內容都是我干的擎值。 我是一名探鬼主播慌烧,決...
    沈念sama閱讀 38,904評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼鸠儿!你這毒婦竟也來了屹蚊?” 一聲冷哼從身側響起厕氨,我...
    開封第一講書人閱讀 37,672評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎汹粤,沒想到半個月后命斧,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經...
    沈念sama閱讀 44,118評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡嘱兼,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,456評論 2 325
  • 正文 我和宋清朗相戀三年国葬,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片芹壕。...
    茶點故事閱讀 38,599評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡汇四,死狀恐怖,靈堂內的尸體忽然破棺而出踢涌,到底是詐尸還是另有隱情通孽,我是刑警寧澤,帶...
    沈念sama閱讀 34,264評論 4 328
  • 正文 年R本政府宣布,位于F島的核電站派歌,受9級特大地震影響步脓,放射性物質發(fā)生泄漏。R本人自食惡果不足惜糠惫,卻給世界環(huán)境...
    茶點故事閱讀 39,857評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望钉疫。 院中可真熱鬧硼讽,春花似錦、人聲如沸牲阁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,731評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽城菊。三九已至备燃,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間凌唬,已是汗流浹背并齐。 一陣腳步聲響...
    開封第一講書人閱讀 31,956評論 1 264
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留客税,地道東北人况褪。 一個月前我還...
    沈念sama閱讀 46,286評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像更耻,于是被迫代替她去往敵國和親测垛。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 43,465評論 2 348

推薦閱讀更多精彩內容

  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理秧均,服務發(fā)現(xiàn)食侮,斷路器号涯,智...
    卡卡羅2017閱讀 134,628評論 18 139
  • 簡介 ?迄今為止,?使用HTML+CSS構建出的頁面始終缺乏“交互性”锯七,為了能夠實現(xiàn)網頁和你之間的互動链快,瀏覽器引入...
    MarkyLumin閱讀 1,109評論 3 1
  • 正在聽五月天的,你不是真正的快樂起胰。每次聽這首歌久又,發(fā)現(xiàn)我越來越喜歡現(xiàn)場版的了,我也成了個大俗人效五,追星地消,追一個很遙遠卻...
  • 立春已經過去三天了,天氣仍然很寒冷畏妖。但是脉执,今天早晨,我還是毅然決然地結束了“冬眠”戒劫,恢復了往常早起晨練的習慣半夷。 早...
    紅塵老街閱讀 2,122評論 12 19