505
innerHTMl和確認提示的使用
現在學習對層的信息控製，即控製一個層中顯示什麼信息，在網上查找許多資料才知道使用innerHTML屬性來控製層的值，這個innerHTML跟表單裏麵的value屬性有點類似，能夠控製層的顯示值。比如說我一個div層裏本來沒有值，我觸發一個事件後要顯示值，那麼就能夠使用innerHTML屬性了，其實innerHTML屬性除了能控製層以外，還能控製窗口內容的所有元素，但是沒有測試過。
（1）對div標簽的控製
div標簽跟span標簽是不一樣的，div是一個層的塊，span是一行，我們下麵看演示就知道區別了。先來看一段控製div的代碼。
<script language="javascript">
function chageDiv(number)
{
if (number == 1) {
document.getElementById("div1").innerHTML = "值為1";
}
if (number == 2) {
document.getElementById("div1").innerHTML = "值為2";
}
}
</script>
DIV塊測試：<div >默認值</div>
<a href="#" onClick="chageDiv(1)">改變值為1</a>
<a href="#" onClick="chageDiv(2)">改變值為2</a>
運行的時候，點擊“改變值為1”那麼“默認值”這個內容將會被改變為“值為1”，但是注意其中的界麵，就是會發現“DIV測試：”和“默認值”是兩行顯示的，因為DIV是按塊來顯示的。
（2）對span的控製
與div類似，但是它是按照行來顯示的，看下麵的代碼：
function chageSpan(number)
{
if (number == 1) {
document.getElementById("span1").innerHTML = "值為1";
}
if (number == 2) {
document.getElementById("span1").innerHTML = "值為2";
}
}
</script>
Span行測試：
<span >默認值</span><br>
<a href="#" onClick="chageSpan(1)">改變值為1</a>
<a href="#" onClick="chageSpan(2)">改變值為2</a>
當點擊“改變值為1”的時候，“默認值”將變為“值為1”，但是“Span行測試”和“默認值”是在同一行顯示的，跟DIV不一樣。
另外一個值得注意的就是，不管是div還是span，後麵的名字都是以為id來定義的，不是象表單一樣是使用name來定義的。
（3）confirm確認提示框的製作
當我們要執行一個危險操作的時候，比如刪除某個內容等，那麼就應該給用戶相應的提示來用戶不容易犯錯誤。一般提示都是使用confirm()函數來處理的，給它提交一個參數作為顯示的信息提示，那麼訪問的時候將彈出對話框，如果點擊了“確定”那麼將改函數返回true，點擊了“取消”將放回false，我們針對這個特點來使用兩種方法來控製用戶是否執行某個操作。
看代碼：
<script language="javascript">
function accessNeteasy()
{
if(confirm('你真的要訪問網易新聞 ?')) {
location='https://calendar.eyou.eyou';
}
}
function accessSina()
{
if (confirm('你確定要訪問新浪新聞 ?')) {
return true;
} else {
return false;
}
}
</script>
訪問方式一：
<a href="#" onClick="accessNeteasy()">網易新聞</a><br>
訪問方式二：
<a href="https://news.sina.com.cn/" onClick="return accessSina()">新浪新聞</a>
我們這裏建立了兩個函數，一個accessNeteay，一個accessSina，就是訪問網易和新浪，我們使用不同的方法，第一種就是當點了鏈接以後，判斷如果是true的話，那麼就location到指定鏈接，這種方法比較不具有通用型，隻能針對單個的鏈接。第二種方法是使用返回值的形式，當確定要訪問的時候返回true，不確定的時候返回false，那麼這個可以針對任何鏈接來做，寫成一個通用的信息提示，方便頁麵中的調用。
以上代碼均來自網絡，都經過測試通過，可以自己再這個基礎上進行擴展，寫出自己需要的JavaScript代碼。
最後更新：2017-04-02 00:06:32