Image not loading with the script

Question

The image is not loading when I am using this script.

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"/>
</head>
<body>
    <img href="https://static.pexels.com/photos/33109/fall-autumn-red-season.jpg" width="200" height="267" alt="me">
</body>
</html>

If I remove the script I'm getting the Image.Code:

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
</head>
<body>
    <img src="https://static.pexels.com/photos/33109/fall-autumn-red-season.jpg" width="200" height="267" alt="me">
</body>
</html>

score 1 · Answer 1 · answered Nov 30 '17 at 12:34

You din't close script tag

use

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

Please check !!

<!DOCTYPE html>
    <html>
    <head>
     <title>test</title>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    </head>
    <body>
     <img src="https://static.pexels.com/photos/33109/fall-autumn-red-season.jpg" width="200" height="267" alt="me">
    </body>
</html>

Sebastian Brosch · Accepted Answer · 2017-11-30T12:40:39.823

The <script> element can't be self-closing (<.../>). You have to close the element with </script>. There is also a mistake on your <img> element. You are using the attribute href. In case the <script> would work your image is still not visible. You have to use the attribute src to show the image.

<!DOCTYPE html>
<html>
    <head>
     <title>test</title>
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    </head>
    <body>
     <img src="https://static.pexels.com/photos/33109/fall-autumn-red-season.jpg" width="200" height="267" alt="me">
    </body>
</html>

score 0 · Answer 3 · answered Nov 30 '17 at 12:39

Try using script tag at the end of body. Also, script tag is not a void element in html, you are not closing your script tag. Try using the following code:

<head>
        <title>test</title>
</head>
<body>
    <img href="https://static.pexels.com/photos/33109/fall-autumn-red-season.jpg" width="200" height="267" alt="me" />
  <script src="https://ajax.googleapis.com/ajax/alibs/angularjs/1.6.4/angular.min.js"></script>
</body>

Image not loading with the script

3 Answers3