Check Your ageInDays by Javascript
<script type="text/javascript">
function ageInDays() {
var birthYear = prompt('What year were your born ?');
var ageInDayss = (2020 - birthYear)*365;
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode('you are' + " "+ ageInDayss + " " + 'days old.')
h1.setAttribute('id','ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
</script>
<style type="text/css">
.flex-box-container-1{
display: flex;
border: 1px solid black;
padding: 10px;
flex-wrap: wrap;
justify-content: space-around;
}
.flex-box-container-1 div{
/* border: 1px solid black;*/
align-items: center;
padding: 10px;
}
.container-1{
border: 1px solid black;
}
</style>
function ageInDays() {
var birthYear = prompt('What year were your born ?');
var ageInDayss = (2020 - birthYear)*365;
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode('you are' + " "+ ageInDayss + " " + 'days old.')
h1.setAttribute('id','ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
</script>
<style type="text/css">
.flex-box-container-1{
display: flex;
border: 1px solid black;
padding: 10px;
flex-wrap: wrap;
justify-content: space-around;
}
.flex-box-container-1 div{
/* border: 1px solid black;*/
align-items: center;
padding: 10px;
}
.container-1{
border: 1px solid black;
}
</style>
<body>
<div class="container-1">
<h1>Challenge: Your Age in days</h1>
<div class="flex-box-container-1" <div>
<button class="btn btn-primary" onclick="ageInDays()">Click Me</button>
</div>
<div>
<button class="btn btn-danger">reset</button>
</div>
</div>
<div class="flex-box-container-1">
<div id="flex-box-result"></div>
</div>
</div>
</body>
Comments
Post a Comment