JS 和 a href className JS編寫順序與運行順序 字符串或變量嵌入中括號 代替 點號 代表屬性
JS 和 a href
在href裏面註意分號結尾, 引號閉合
<a href="javascript:;">空鏈接</a> <a href="javascript:alert(‘a‘);">彈出</a>
一般不妨代碼, 一般讓它空著. 空著也可以用井號‘#‘, 但不是很好.
className
<style> #div1 {width:100px; height:100px; border:1px solid black;} .box {background:red;} </style> <script> function toRed() {var oDiv=document.getElementById(‘div1‘); oDiv.className=‘box‘; //不要寫成class } </script> </head> <body> <input type="button" value="變紅" onclick="toRed()" /> <div id="div1">
1. getelementbyId 是和id 相連. 但沒有和 class相連的方法.
| getElementById() | 返回對擁有指定 id 的第一個對象的引用。 |
| getElementsByName() | 返回帶有指定名稱的對象集合。 |
| getElementsByTagName() | 返回帶有指定標簽名的對象集合。 |
要用JS 根據/創建 className索引樣式 . 需要在getelement後再加一個二級屬性‘.className‘.
加了之後本來指定id的標簽 不單從‘井號‘索引針對id的樣式, 也同時從‘點號‘索引針對class的樣式.
2. getelement.className = ‘box‘; 引起的變化: //上面的例子是oDiv 換一個說法而已一樣的.
如果<div>標簽裏面已經有class=xxx 的屬性, 那麽事件動作引出函數的時候, class=xxx將會被修改成class=box
如果<div>沒有class =xxx , 就會在執行script的時候順帶創建.
回想一下 如果<div> 沒有指明的style = XXX, 那麽getelement.style.backgroud 也會自動創建
getelement. + style/ class / type / href / value 等等, 想改想加都可以很方便隨意了.就怕你不像改
這僅僅是 一種方法.
- 還有getelement [‘value‘] 這樣中括號引號的方式, 和 . (點號) 的帶出屬性是一樣的. 一般不是特殊情況不會使用[‘ ‘] 這種方式.
如果[‘‘] 要引用的是某個變量 假設 a =‘width‘, 那麽[‘a‘] 就變成 [‘ ‘ width ‘ ‘] 這樣就不符合getelement [‘屬性‘] 這樣的概念了.
這時候的處理方法就可以是[a] 就不帶引號了!
- 所有的 . 都可以用 [‘‘] 代替
oDiv.className=‘box‘; //下面的是等價的
oDiv[‘className‘] =‘box‘;
多層也可以, oDiv[‘style‘][‘width‘] = ‘40px‘
- 什麽時候 需要用[‘‘]? 函數傳參 一般可以傳到值上, 有時候要傳到屬性名稱上代表屬性, 這時候就要用到[‘‘]
JS嵌入的html運行順序:
-執行事件動作, 執行指向的JS函數, 函數對指定id標簽進行修改.
JS嵌入的html代碼編寫順序:
-想好更改什麽效果, 標註id/class 到指定效果標簽, 使用 .或者# 創建{style}, 調用ID編寫變更css的邏輯, 用事件函數觸發.
JS 和 a href className JS編寫順序與運行順序 字符串或變量嵌入中括號 代替 點號 代表屬性