如何在DIV內更新新圖像？

我是新來的HTML和Javascript。請有人可以幫助我以下。加載頁面後，以下代碼將正常顯示579。但是，我需要它顯示一個不同的數字，而不刷新整個頁面。例如，如果有東西觸發了鼠標點擊，則會顯示795（圖像）。我能做些什麼來使圖像中的新號碼顯示在與之前相同的位置上。非常感謝你。如何在DIV內更新新圖像？

` DisplayNumImg（5,7,9）;

<a href="#" onclick="DisplayNumImgChanged(7,9,5)" /a> 



#child2-3 
{ 
position: absolute; 
width: 165px; 
height: 15px; 
left: 5px; 
top: 40px; 
} 

.thumb_child1 
{ 
    float:right; 
    margin:0px; 
} 


function DisplayNumImg(a, b, c) 
{ 

    var s; 

    if (a == 5) { 
    s = '<img class="thumb_child1" src="./images/5_blu.png"> '; 
    document.write(s); 
    } 

    if (a == 7) { 
    s = '<img class="thumb_child1" src="./images/7_blu.png"> '; 
    document.write(s); 
    } 

    if (a == 9) { 
    s = '<img class="thumb_child1" src="./images/9_blu.png"> '; 
    document.write(s); 
    } 
} 

function DisplayNumImgChanged(a,b,c) 
{ 
    // please help me with code here or something that you think it would work. Thanks. 
}

來源

2012-06-14 user1456767

好吧，首先：我強烈建議你應該學習和使用jQuery（然後，如果你還想改進開發者的話，那麼回過頭來學習它是如何工作的。它的權力）。它會讓事情變得更容易。

在這種情況下，這聽起來像你想要做的是更新你的圖像元素的src屬性。與jQuery這是可以做到如下：

$('.thumb_child1').attr('src', './images/9_blu.png');

在原料JS，那會是這樣的：

var thumbs = document.getElementsByTagAndClassName(null, 'thumb_child1'); 
for (var i = 0; i < thumbs.length; i++) { 
    thumbs[i].src = './images/9_blu.png'; 
}

（雖然上面的代碼是未經測試的，所以回來後，如果您有問題）

來源

2012-06-14 21:50:11 machineghost

作爲一個附註，當他說「不要使用document.write（ever！）」時，Damen是完全正確的。一般來說，當你想在JS中添加一個元素（沒有jQuery）時，你應該做些什麼.appendChild（newElement），其中「something」是「document.body」或其他元素，newElement是你通過文檔創建的元素.createElement。但同樣，jQuery使事情變得更簡單：$（document.body）.append（'html for your element go here here，例如

foo

'）。 – machineghost

感謝您的支持。 – user1456767

沒問題。僅供參考，習慣上表示讚賞Stack Overflow的問題/回答/評論的方式是單擊旁邊的向上箭頭（即「upvote」）。同樣，如果你的帖子的答案之一回答你的問題（這看起來像micadelli在這種情況下最適合你），習慣上點擊該答案旁邊的複選標記（即「接受」它）。 – machineghost

沒有在風格標籤
把JavaScript的唯一
在腳本標籤使用文件撰寫（永遠！）
放CSS發佈實際的代碼在stackoverflow（該代碼將永遠不會工作）

來源

2012-06-14 21:48:03

是的，我會研究更多....謝謝ÿ ou – user1456767

如果我明白你是做什麼，這樣的事情可能工作：

function DisplayNumImgChanged(a,b,c) 
{ 
    var valueArray = [a, b, c]; 
    var imgElems = document.getElementsByClassName('thumb_child1'); 
    for (var i = 0 ; i < imgElems.length ; i++) { 
     imgElems[i].src = './images/' +valueArray[i]+ '_blu.png'; 
    } 
}

來源

2012-06-14 21:56:36 micadelli

是的，它的工作......非常感謝。我將學習更多的知識來熟悉Javascript，HTML，Jquery。 – user1456767

如何在DIV內更新新圖像？

回答

相關問題