靜態頁面做完了，現在用js做一個背景圖片隨機切換的效果。

1.點選‘個人網站'這個字樣，實現body背景的切換。所以，首先獲取這兩個節點。

var body = document.body;
var change_btn = document.getElementById("change_btn");

2.新增change_btn的onclick點選事件，在點選事件中    寫獲取隨機圖片路徑  的方法image_url( ),程式碼解釋見註釋

change_btn.onclick = function(){
		
		var image_url = function(){//獲取隨機圖片的路徑方法
			var image_path = "img/images/";//定義背景圖片的路徑常量部分；
			var image_index =parseInt(Math.floor(Math.random()*75));//用random函式獲取範圍在0-75的隨機數字並向下取整
			                                                        //轉化成int數值型別
		    return image_path+image_index+'.jpg';//利用字串拼接返回圖片路徑
		};
 

完整js程式碼：

window.onload = function(){
    var body = document.body;
	var change_btn = document.getElementById("change_btn");
	
	change_btn.onclick = function(){
		
		var image_url = function(){//獲取隨機圖片的路徑方法
			var image_path = "img/images/";//定義背景圖片的路徑常量部分；
			var image_index =parseInt(Math.floor(Math.random()*75));//用random函式獲取範圍在0-75的隨機數字並向下取整
			                                                        //轉化成int數值型別
		    return image_path+image_index+'.jpg';//利用字串拼接返回圖片路徑
		};
		body.style.background = 'url('+image_url()+')';
	};
}
 

注意：

1.隨機圖片是根據隨機產生的數字來查詢對應的圖片路徑。所以，圖片以  數字+圖片  格式命名。

2.常規訪問圖片用相對路徑，js是外聯檔案，與圖片不在同級目錄中，需要在img資料夾前加 '../'。其實，js在查詢圖片時是根據包來查詢的，加上‘../’反而不能正常顯示圖片。這點很重要。     

css與js引用圖片的路徑問題參考文章：點選開啟連結