 |
| corona case |
Code of Find Corona case using API
Using HTML, CSS, JAVASCRIPT
<!doctype html
>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<title>covid data</title>
</head>
<body>
<div class="container">
<table class="table table-hover">
<h1 class="text-center">Global cases Corona Developed By Kameshwar</h1>
<thead>
<tr>
<th scope="col">Total Confirmed</th>
<th scope="col">Total Deaths</th>
<th scope="col">Total Recovered</th>
<th scope="col">Date</th>
<th scope="col">Countries</th>
</tr>
</thead>
<tbody>
<tr id="data">
</tr>
</tbody>
</table>
<br>
<table class="table table-hover">
<h1 class="text-center">India cases Corona </h1>
<thead>
<tr>
<th scope="col">Total Confirmed</th>
<th scope="col">Total Deaths</th>
<th scope="col">Total Recovered</th>
<th scope="col">Date</th>
</tr>
</thead>
<tbody>
<tr id="india">
</tr>
</tbody>
</table>
<button onclick="refreshData()" class="btn btn-danger btn-block">
Refresh data
</button>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
init()
function init() {
var url = "https://api.covid19api.com/summary"
var data = ''
var india = ''
$.get(url, function (data) {
console.log(data.Global)
data = `<td>${data.Global.TotalConfirmed}</td>
<td>${data.Global.TotalDeaths}</td>
<td>${data.Global.TotalRecovered}</td>
<td>${data.Global.Date}</td>
`
$("#data").html(data)
})
}
function refreshData() {
clearData()
init()
}
function clearData(){
$("#data").empty()
}
</script>
</body>
</html>
Comments