javascript獲取、設置修改img的src屬性（get/setAttribute）

在開發網站過程中，事先就設置好了圖片img的src性，一般來說很少修改這個屬性，網站加載時直接顯示事先設置好的圖片。但如果網頁要求實現滾屏加載圖片（動態加載圖片），也就是一次不顯示網頁內的所有圖片，當滾動屏幕時再顯示進入屏幕區的圖片。這樣不但可以減少對服務器的請求次數，而且能大大節省服務器的流量。

滾屏加載圖片事先把網頁內要動態顯示圖片的所有src屬性設置爲一張小圖，待要顯示目標圖片時再把src屬性設置爲目標圖片的路徑。這樣就能實現用戶看一張圖片顯示一張，對於圖片特別多的網頁能大大節省流量。

一、javascript獲取img的src屬性（getAttribute）
　　在設置修改img的src屬性過程中，少不了要獲取圖片的路徑，也就是要獲取img的src屬性。獲取方法有兩種，其一，使用getAttribute方法；其二，直接用圖片對象的src。兩種方法舉例如下：

示例使用圖片對象：

方法一：使用getAttribute方法獲取img的src屬性

var obj = document.getElementById(“imgid”);
　　var imgSrc = obj.getAttribute(“src”);
　　var realSrc = obj.getAttribute(“tSrc”);

用getAttribute()方法不但可以獲取到img的src屬性，還能獲取到不是img固有的tSrc屬性。這個方法獲取能力強一些，但版本低的老瀏覽器（如ie6）不支持。

方法二：直接獲取img的src屬性

var obj = document.getElementById(“imgid”);
　　var imgSrc = obj.src;//能獲取到
　　var realSrc = obj.tSrc;//提示undefined，即tSrc屬性沒有定義，不能獲取到

二、javascript設置修改img的src屬性（setAttribute）
　　js設置修改img的src屬性也像獲取一樣有兩種方法；其一，用setAttribute方法；其二，根據圖片對象直接獲取src屬性。兩種方法分別舉例如下：

示例使用圖片對象：

方法一：使用setAttribute方法修改img的src屬性

var obj = document.setElementById(“imgid”);
　　var imgSrc = obj.setAttribute(“src”, tSrc);//把圖片修改爲目標路徑
　　var realSrc = obj.setAttribute(“tSrc”, src);//把圖片的路徑暫存到tSrc

使用 setAttribute 方法，無論是修改src屬性還是設置tSrc屬性都有效，不過舊版本的瀏覽器（如ie6）不支持，ie8以上瀏覽器才支持。

方法二：直接設置img的src屬性

var obj = document.getElementById(“imgid”);
　　obj.src = imgSrc;//能設置
　　obj.tSrc = realSrc;//提示undefined，即tSrc屬性沒有定義，設置失敗

//點擊切換圖片 案例一 start
	var ImgOne = document.getElementById("ImgOne");
	var flag = true;
	ImgOne.onclick = function(){
		if(flag){
			 
            ImgOne.src = "images/myself_image1.jpg";
			flag = false;
		}
		else{
			ImgOne.src = "images/潮流動圖4.jpg";
			flag = true;
		}
	}
	
	
	//點擊切換圖片 案例一 over