simple javascript help

hi im new to javascript and basically trying to work out. when i click on the links to display an image in a place holder. if placeholder1 is used by either 1.jpg, 2.jpg, or 3.jpg then to leave placeholder1 with that image and use placeholder2. hope that makes sense thanks for any help

<script type="text/javascript" language="javascript">
function showPic (whichpic) { 
    if (document.getElementById) { 
        document.getElementById('placeholder1').src = whichpic.href
        if (whichpic.title) { 
            document.getElementById('desc').childNodes[0].nodeValue = whichpic.title; 
        } else { 
            document.getElementById('desc').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue; 
        } 
        return false; 
    } else { 
        return true; 
    } 
}
</script>

<div style="border: 1px solid #999; padding: 1em; margin: 0 0 15px 0;">
<ul>
<li><a onclick="return showPic(this)" href="/images/1.jpg" title="A bunch of bananas on a table">some bananas</a></li>
<li><a onclick="return showPic(this)" href="/images/2.jpg" title="Condiments in a Chinese restaurant">two bottles</a></li>
<li><a onclick="return showPic(this)" href="/images/3.jpg" title="Seashells on a table">some shells</a></li>
</ul>

<p id="desc">Choose an image to begin</p>
<img id="placeholder1" src="/images/blank.gif" alt="开发者_JAVA百科" />
<img id="placeholder2" src="/images/blank.gif" alt="" />
</div>

---

If you're asking how to find out what the value of an attribute in an element is, you can use jQuery like so ....

var src = $('#placeholder1').attr('src');

you can then use index of, or some other string function to determine if the src attribute contrains the filename you're interested in.

---

Store a reference to placeholder1 in a variable. Check the src of placeholder1 to see if it is any of the images you mentioned (In my example, I use a regular expression to accomplish that). If it is one of those images, reassign your variable to a reference to placeholder2:

function showPic (whichpic) { 
    var ph = document.getElementById('placeholder1');
    if (/[1-3]\.jpg/.test(ph.src)) {
        ph = document.getElementById('placeholder2');
    }
    ph.src = whichpic.href;
    var descChild = document.getElementById('desc').childNodes[0];
    descChild.nodeValue = whichpic.title || whichpic.childNodes[0].nodeValue;
}

Note, you don't need to test for the existence of document.getElementById. If the browser supports JavaScript, it supports document.getElementById.

---

I have to admit I don't know enough about the "getAttribute" method to address it's cross browser compatibility...

function showPic (whichpic) { 
    if (document.getElementById) {
        if(document.getElementById('placeholder1').getAttribute("src") == "/images/blank.gif") {
           document.getElementById('placeholder1').src = whichpic.href;
        } else {
           document.getElementById('placeholder2').src = whichpic.href;
        }
        if (whichpic.title) { 
            document.getElementById('desc').childNodes[0].nodeValue = whichpic.title; 
        } else { 
            document.getElementById('desc').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue; 
        } 
        return false; 
    } else { 
        return true; 
    } 
}

Edit: switched '.src' to 'getAttribute("src")'