Aapka Apna blog jo kre apki problem Solve

Friday 5 July 2019

Show Random Images With javascript Api

Show Random Images With Api 



Code Here


<!DOCTYPE html>

<html>

<head>

<title> Change Man With Api</title>

<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js">

</script>

<style type="text/css">

body{

background-color: black;

}


h1{

color: white;

text-align: center;

}


         #dinkar{

          border-color: white;

         }


         #img1{

          color: white;

         }

</style>

</head>

<body>


 <center>

       <div id="dinkar">

<h1>Enter your Name And check Your Image</h1>

<br>

<input type="text" name="name" id="nameid">


<br><br>


<img src="sachin.jpg" width="400px" height="300px" class="imgchange" alt="This image was not found please enter your name" id="img1">  <br><br>



<button onclick="api()">Click Here </button>


</div>


 </center>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js">


</script>


<script>

  function api(){

var dinkar = document.getElementById('nameid').value;


     if (dinkar == ""){

      alert("Enter your Name");

     }


else

  {

 $(document).ready(function(){

  $('button').click(function(){

   var name = $('#nameid').val();

   alert(name);

   $('.imgchange').attr('src',`https://joeschmoe.io/api/v1/${name}`);

  


  });

 });


  }


  };

</script>

</script>


</body>

</html>






Share:

1 Comments:

  1. Tribute to Tribute to Tribute to Tribute to Tribute to Tribute
    Tribute to Tribute to Tribute to Tribute to titanium chloride Tribute to Tribute to titanium dioxide skincare Tribute to Tribute babyliss pro nano titanium curling iron to Tribute to Tribute to Tribute to Tribute to Tribute to titanium price per ounce Tribute to Tribute to Tribute titanium nipple jewelry to Tribute to Tribute to Tribute to Tribute to

    ReplyDelete

loading...