首頁 > web前端 > H5教程 > className和a href 的實例詳解

className和a href 的實例詳解

零下一度
發布: 2017-06-29 11:14:52
原創
2195 人瀏覽過

JS 和a href

在href裡面注意分號結尾, 引號閉合

<a>空链接</a><a>弹出</a>
登入後複製

className和a href 的實例詳解




#一般不妨程式碼, 一般讓它空著. 空著也可以用井號'#', 但不是很好.1. getelementbyId 是和id 相連. 但沒有和cl​​ass相連的方法. getElementById()傳回對擁有指定id 的第一個物件的參考。
##className
<style>#div1 {width:100px; height:100px; border:1px solid black;}.box {background:red;}</style><script>function toRed()
{var oDiv=document.getElementById(&#39;div1&#39;);
    
    oDiv.className=&#39;box&#39;;             //不要写成class
}</script><input><div></div>
登入後複製
###############getElementsByName()###############傳回指定名稱的物件集合。 #####################getElementsByTagName()###############傳回指定標籤名稱的物件集合。 ################

要用JS  根據/建立className索引樣式. 需要在getelement後再加一個二級屬性'.className'. 

加了之後本來指定id的標籤不單從'井號'索引針對id的樣式, 也同時從'點號'索引針對class的樣式.


2. getelement.className = 'box';  引起的變化:          例子是oDiv 換一個說法而已一樣的.

如果

標籤裡面已經有class=xxx 的屬性, 那麼事件動作引出函數的時候, class=xxx將會被修改成class=box

如果

沒有class =xxx , 就會在執行script的時候順帶創建.

回想一下如果

沒有指明的style = XXX,  那麼getelement.style .backgroud 也會自動創建

getelement. + style/ class / type / href / value  等等, 想改想加都可以很方便隨意了.就怕你不像改

這只是一種方法.

- 還有getelement ['value'] 這樣中括號引號的方式, 和. (點號) 的帶出屬性是一樣的. 一般不是特殊情況不會使用[' '] 這種方式.

如果[''] 要引用的是某個變數假設a ='width', 那麼['a'] 就變成[' ' width ' '] 這樣就不符合getelement ['屬性'] 這樣的概念了.

這時候的處理方法就可以是[a] 就不帶引號了!

- 所有的. 都可以用[''] 取代

oDiv.className#=##'##box ';            //下方的是等價的

oDiv

['className'] =##oDiv['className'] = 'box

'

;

#多層也可以, oDiv

['style'][' width']

= '40px'className和a href 的實例詳解

- 什麼時候需要用['']? 函數傳參一般可以傳到值上, 有時候要傳到屬性名稱上代表屬性, 這時候就要用到['']

JS嵌入的html運行順序:

-執行事件動作, 執行指向的JS函數, 函數對指定id標籤進行修改.

JS嵌入的html程式碼編寫順序:#########-想好更改什麼效果, 標註id/class 到指定效果標籤,  使用.或# 建立{style}, 呼叫ID編寫變更css的邏輯,  用事件函數觸發.###

以上是className和a href 的實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板