pCloud Partner Program

querySelector - javascript的查詢選擇器

程式技術/Javascript 2016/01/08 11:35
views: 127418 times
在有 jQuery 環境下, 操作選擇器很直覺, 不過沒有 jQuery 時, 如何進行相關的作業呢? 以下幾組為可能會用到的指令:

1. document.getElementById 指定 id 來取得該物件 (唯一)
2. document.getElementsByTagName 指定 html tag 來取得該物件陣列 (通常為多個)
3. document.getElementsByClassName 指定 class name (可多組 class name 一起) 來取得該物件陣列 (通常為多個)
4. document.querySelector 使用 css selector 來取得該物件 (注意, 僅傳回符合條件的第一筆)
5. document.querySelectorAll 使用 css selector 來取得該物件陣列 (符合條件的多筆)

當物件被選擇出來後, 就可以進行操作了, 操作的方式可以再參考這裡:

http://www.w3schools.com/jsref/dom_obj_all.asp

在沒有 jQuery 的狀況下, 也能順利選擇物件, 並進行操作了.

top

很好用的javascript除錯工具FireBug (firefox)

好用軟體 2006/06/11 23:56
views: 147361 times
firefox extesion tools好用的不少, 在一個偶然的機會, 發現有個對 javascript除錯相當好用的工具, FireBug.

原來在firefox內建的javascript console就已經能提供相當多的資訊應用於javascript有錯誤時的除錯, 然而, firebug更強捍的地方有

more..




top

超強的Web Developer extension功能(firefox)

好用軟體 2006/06/05 16:44
views: 85600 times
先下載 firefox:
http://www.mozilla.com/firefox/

之後再安裝
https://addons.mozilla.org/firefox/60/

接下來就是很強的功能介紹了, 一般我們在寫 client side 的 html, javascript這些tag或script, 最麻煩的就是debug的部分, 然而, 用 firefox 加上一個 web developer extesion 後, 你會發現一切都改觀了, 無論是 form 的變數, input text 密碼顯示, 長度取消, readonly 改為可寫入, 隨時修改html source改變顯示結果, cookie 變數, 變數值, div, iframe 等區域顯示, javascript 除錯, validation css 及html的功能, 都可以很容易的在一個瀏覽器內實現, 果然名如其功能, 就是好用的 [web developer]. 無論是程式設計人員或是網頁美工人員, 都是不可或缺的一個好工具. 不過 firefox 就是 layout 和 ie 不太一樣, 為了滿足廣大 ie 的用戶, 建議是搭配 firefox 寫 html及script配合 ie preview, 應該是最理想的方式囉....

more..

top




Patriot美商博帝 BURST 960G 2.5吋 SSD固態硬碟
TEAM十銓 L5 Lite 3D 1TB 2.5吋 SSD固態硬碟
統一 番茄汁(6入/組)
UNITEK TYPE-C 轉VGA/HDMI/PD充電/HUB 鋁合金多功能轉接器
亞果元素 CASA Hub VH1 Type-C 轉 VGA - HDMI二合一顯示轉接器


 Waiting...