#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2013
    Posts
    2
    Rep Power
    0

    Silly question regarding an if else condition triggering dom manipulation


    OK, so I am just beginning to learn Javascript and I am new to programming in general. I am messing around trying to get this bit of code working, and when I click the button the image will change, but when I click it again it doesnt change back to the original image..I cant seem to figure out what it is Im doing wrong, i mean this should be possible with a simple if else condition correct?



    Code:
    <!doctype html>
    <html>
    <head>
    <title>test</title>
    </head>
    
    <body>
    <img id="picture" src="desert.jpg" alt="desert">
    <button onclick="myfunction()">click me</button>
    <script>
    function myfunction() {
    if (document.getElementById("picture").src="desert.jpg")
    {
    	document.getElementById("picture").src="Jellyfish.jpg";
    	}
    else 
    {
    document.getElementById("picture").src="desert.jpg";
    }
    
    }
    </script>
    
    </body>
    </html>
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2013
    Posts
    101
    Rep Power
    27
    Oops, assignment instead of comparison:
    Code:
    if (document.getElementById("picture").src="desert.jpg")
    Should be
    Code:
    if (document.getElementById("picture").src == "desert.jpg")
    Somewhere else recently I read someone else's good point: when writing a conditional comparing a variable and a static value, like TRUE or "desert.jpg", you should put the static value FIRST.
    Code:
    // this code will produce an "invalid assignment" error, which is useful:
    if ("desert.jpg" = document.getElementById("picture").src)
    That way you more often catch the error of a missing equals-sign in your conditional.
    Last edited by mod_speling; September 5th, 2013 at 11:44 AM. Reason: afterthought
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Sep 2013
    Posts
    2
    Rep Power
    0
    Originally Posted by mod_speling
    Oops, assignment instead of comparison:
    Code:
    if (document.getElementById("picture").src="desert.jpg")
    Should be
    Code:
    if (document.getElementById("picture").src == "desert.jpg")
    Somewhere else recently I read someone else's good point: when writing a conditional comparing a variable and a static value, like TRUE or "desert.jpg", you should put the static value FIRST.
    Code:
    // this code will produce an "invalid assignment" error, which is useful:
    if ("desert.jpg" = document.getElementById("picture").src)
    That way you more often catch the error of a missing equals-sign in your conditional.

    hmm i tested that out, but now with the comparison operator when i click the button the image doesnt change at all
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jul 2013
    Posts
    101
    Rep Power
    27
    Are you familiar with the error console in your browser of choice? Find it and see if there are any error messages in there when you load up your web page and/or when you click the button?

IMN logo majestic logo threadwatch logo seochat tools logo