<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.jquery.com/jquery-3.4.1.js" type="text/javascript"></script>
<style>
.details {
width: 100px;
height: 30px;
text-align: center;
line-height: 30px;
background-color: #005aff;
font-size: 18px;
color: #fff;
font-weight: 700;
border-radius: 5px;
}
#dialog {
color: red;
font-weight: 700;
font-size: 30px;
}
</style>
</head>
<body>
<?php
$jsons = file_get_contents('http://localhost/json/');
// $jsons = file_get_contents('json.json');
$obj = json_decode($jsons);
?>
<script type="text/javascript">
$(document).ready(function(){
var JSON = <?php echo json_encode($obj); ?>;
$('.details').click(function(){
console.log(JSON);
$('#dialog').html(JSON.Mot);
});
})
</script>
<div class="details">Details</div>
<center><div id="dialog">red</div></center>
</body>
</html>
