Javascript displaying image

Question

my overall goal is to load an image given user lattitude and longitude. However, my code has an error logic somewhere I assume (document.write("Dog") is never displaying to the screen) so I have to assume something is going wrong. The user is being prompted for a lat and longitude after clicking the button but afterwards nothing is happening. Any Ideas what might be going on? I'm a beginner so i am sure it is something simple.

<body>
<p>Click the button to demonstrate the prompt box.</p>
<button onclick="myFunction()">Try it</button>
   <script>
        function myFunction() {
            var x;
            var latittude = prompt("Please enter a lat");
            var longitude = prompt("please enter your longitude");
            var img = document.createElement('img');
            img.src = 'http://maps.googleapis.com/maps/api/streetview?size=400x400&location='+ latittude + ',' + longitude + '&heading=235&sensor=false';
            img.height = 200;
            img.width = 300;
            img.alt = alt;
            document.write(img.src);
            document.write("dog");
            document.getElementById('body').appendChild(img);
        }
</script>
 </body>

Don't use document.write, see the warning in the spec. Use DOM methods instead. — Oriol
– Oriol, Commented Apr 9, 2014 at 17:00

Community · Accepted Answer · 2017-05-23 12:05:37Z

1

img.alt = alt; but you have not defined a variable named alt.

document.getElementById('body') but there is no id with a value of 'body', to reference it use document.body.appendChild(img);.

Also unless this is just messing around for practice, take a look at: Why is document.write considered a “bad practice”?.

For future reference if you use the developer tools in your browser (F12) any script errors will be printed out in the console.

edited May 23, 2017 at 12:05

CommunityBot

11 silver badge

answered Apr 9, 2014 at 16:59

Alex K.

177k32 gold badges276 silver badges299 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user3513466 Over a year ago

Thanks. Figured it out based on this! Also, I had absolutely no idea about the developer tools. That is going to make the learning process much easier.

Collectives™ on Stack Overflow

Javascript displaying image

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related