javascript地址欄寫法

來源:互聯網
上載者:User
 

0. 前言

所謂IE地址欄運算式,就是在IE的地址欄中輸入 javascript:<代碼>,執行某些功能,來動態改變原有頁面的參數以達到某些目的,例如開放被禁止的按鈕、顯示原本隱藏的圖片等等。本文將就IE地址欄的使用方法做一個詳細的說明。

1. 運算式的書寫方法

在IE的地址欄中輸入 javascript:<代碼>,即可在當前頁面上直接執行指定的代碼並立即看到效果。而且,<代碼>中可以包含多條語句,甚至可以包含 if/for 等流程式控制制語句。

代碼一般有兩種寫法:

javascript:<運算式>

該寫法將會執行運算式,並將運算式的結果在當前頁面內顯示。

javascript:<函數>

該運算式將會執行指定的函數,而當前頁面的顯示不會受到影響。

那麼IE如何區分地址欄中輸入的代碼到底是函數還是運算式?其實很簡單,代碼的最後一條語句以參數列表 () 結束,則作為函數處理,不更新頁面顯示;代碼的最後一條語句不以 () 結束,則作為運算式處理,在當前頁面內顯示運算式的計算結果。

例如,在IE的地址欄中輸入:

javascript:1+2

該運算式的末尾並非參數列表,因此IE將1+2看作運算式,執行結果將顯示在當前視窗內:

3

而下面這段代碼:

javascript:alert("Hello, world!")

代碼末尾為參數列表,因此IE將其看作函數,執行之後將出現快顯視窗,但是網頁的內容不會有任何變化。再如,

javascript:alert

該代碼執行後,當前視窗內顯示:

[object]

這是因為代碼末尾不是參數列表,因此IE將其作為運算式來處理。alert 為 window 對象的一個方法,也算作“[object]”,所以出現了上面的結果。

再看下面的例子:

javascript:a=1;b=2;c=3;alert(a+b*c)

雖然該段代碼中包含了賦值運算式和alert()函數,但由於代碼最末尾是參數列表,因此頁面內容不會更新。

2. 將運算式轉化為函數

通常我們希望使用 javascript:<函數> 這種格式,因為 javascript:<運算式> 會改變頁面內容而使得修改失去意義。但有時我們不得不使用賦值運算式來達到目的,這就需要將運算式轉換為函數來執行。這就需要利用一個特殊的函數:void()。該函數帶有一個參數。

比較常用的轉化方式有兩種。一種是將運算式作為void()函數的參數,例如:

javascript:void(a=1)

執行之後頁面內容沒有任何變化,但是頁面內名為a的變數已經賦值為1了。另一種方法是在整個代碼的最後執行void()函數,例如:

javascript:a=1;void(0)

也可以達到同樣的效果。

在網上通常可以找到一些網頁的hack代碼,例如:

javascript:void(document.all.btn1.disabled=false);void(document.all.btn2.disabled=false)

該段代碼對每一個運算式執行了一次 void()函數。實際上有更簡單的方法,只需要執行一次即可:

javascript:document.all.btn1.disabled=false;document.all.btn2.disabled=false;void(0)

3. 常用hack代碼

這裡介紹一些常用的 hack 程式碼片段,大家可以靈活運用。

3.1 尋找頁面內元素

使用 document 對象的 all 集合和 getElement 系列方法可以輕易地找到頁面上各種元素。如果知道一個元素的id(假設為myelement),則可以通過下面兩種方式獲得該元素:

document.all.myelement
document.getElementById('myelement')

如果不知道元素的id,但知道元素的HTML標籤名(假設為TAGNAME),則可以通過下面的代碼獲得所有相同標籤的元素:

document.getElementsByTagName('TAGNAME')

傳回值為一個集合,通過該集合的 item 方法可以擷取其中的一個元素。例如,修改頁面上的第三個超連結的顏色為綠色:

javascript:document.getElementsByTagName('A').item(2).style.color="green";void(0)

將頁面上所有的 TD 元素的背景顏色修改為紅色:

javascript:tds=document.getElementsByTagName('TD');for(i=0;i<tds.length;i++){tds.item(i).style.backgroundColor="red";}void(0)

3.2 定義函數

可以在地址欄中直接書寫function語句來定義函數。例如,先在地址欄中輸入:

javascript:function hello(){alert("Hello!");}

確定之後,再次在地址欄中輸入:

javascript:hello()

即可看到快顯視窗。

3.3 顯示效果類特效

通過各個元素的 style.zoom 屬性可以設定該元素的顯示比例。例如,將頁面整體顯示比例擴大為150%:

javascript:document.style.zoom='150%';void(0)

通過各個元素的 style.display 和 style.visibility 屬性可以顯示/隱藏該元素。style.display=""可以顯示元素,style.display="none"可以隱藏元素,而且被隱藏的元素不會佔用頁面位置,就像根本不存在一樣;style.visibility=false可以隱藏元素,但是被隱藏的元素還會保持原有的位置和大小;style.visibility=true可以顯示元素。例如,隱藏所有圖片:

javascript:a=document.getElementsByTagName('IMG');for(i=0;i<a.length;i++)a.item(i).style.visibility=false;void(0)

3.4 其他

顯示頁面所有連結:

javascript:a=document.getElementsByTagName("A");newwindow=window.open("newwindow");newwindow.document.open();for(i=0;i<a.length;i++){newwindow.document.write("<a href='"+a.item(i).href+"'>"+a.item(i).innerText+"</a><br>");}newwindow.document.close();void(0)

 
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.