<!DOCTYPE html>
<html>
<head>
<title>Find sunday on jan ist </title>
</head>
<!-- body containing submit button to check and div to display the result-->
<body>
<input type="submit" value="Check" onclick="findSun()" />
<div id="output1">
</div>
</body>
<script>
function findSun()
{
//for loop that checks january 1st on each year from 2015 to 2015 for sunday
for(var year = 2015; year <= 2030; year++)
{
var today = new Date(year,0,1);
var dd = today.getDay();
if(dd===0)
{
var dis = "Jan 1st Of :" + year + "is Sunday";
console.log(dis);
document.getElementById('output1').innerHTML = dis;
}
else
{
document.getElementById('output1').innerHTML= "";
}
}
}
</script>
</html>
it is a simple program which checks for sunday on jan 1st for each year starting from 2015-30.I am able to get the correct output on console,but I am not able to get correct output on page using innerHTML. I am new to javascript any help is apprreciated.
You are erasing the content of your 'output1 element' each time the day don't match.
If you want to keep the previously found sunday, you can just append -with += - to the div.
<!DOCTYPE html>
<html>
<head>
<title>Find sunday on jan ist </title>
</head>
<!-- body containing submit button to check and div to display the result-->
<body>
<input type="submit" value="Check" onclick="findSun()" />
<div id="output1">
</div>
</body>
<script>
function findSun()
{
//for loop that checks january 1st on each year from 2015 to 2015 for sunday
for(var year = 2015; year <= 2030; year++)
{
var today = new Date(year,0,1);
var dd = today.getDay();
if(dd===0)
{
var dis = "Jan 1st Of :" + year + "is Sunday";
console.log(dis);
document.getElementById('output1').innerHTML += ", " + dis;
}
else
{
document.getElementById('output1').innerHTML += "\n";
}
}
}
</script>
</html>
You have a couple of problems, the first one is noted above with your else statement erasing the contents of the that can be fixed with a +=.
The second issue is that your if statement has one too many "="
<title>Find sunday on jan ist </title>
</head>
<!-- body containing submit button to check and div to display the result-->
<body>
<input type="submit" value="Check" onclick="findSun()" />
<div id="output1">
</div>
</body>
<script>
function findSun()
{
//for loop that checks january 1st on each year from 2015 to 2015 for sunday
for(var year = 2015; year <= 2030; year++)
{
var today = new Date(year,0,1);
var dd = today.getDay();
if(dd==0)
{
var dis = "Jan 1st of: " + year + " is Sunday";
console.log(dis);
document.getElementById('output1').innerHTML += dis + "<br>";
}
}
}
</script>
</html>
Try changing this It will do the job
Problem was you were over writing the innerhtml not appending thats why it was creating problems.
for(var year = 2015; year <= 2030; year++)
{
var today = new Date(year,0,1);
var dd = today.getDay();
if(dd===0)
{
var dis = "Jan 1st Of :" + year + "is Sunday";
console.log(dis);
document.getElementById('output1').innerHTML += dis + "</br>";
}
else
{
document.getElementById('output1').innerHTML += "";
}
}
Related
I am creating a JavaScript hangman game and am having trouble figuring out how I would prompt the user to guess the letters of the hangman puzzle, and then update the page with .innerHTML the guessed letter in place of the dashes I have on the screen.
I have a while loop set up to prompt for the guesses and do the work of placing the letters that are guessed in the length of the word, but it will prompt continually until more than 10 guesses are made and than print the dashes to screen.
This is the code that I am currently using.
function myGame()
{
var player_name = document.getElementById("player");
document.getElementById("user_name").innerHTML = "Welcome " + player_name.value + " to Wheel of Fortune";
var count = 0;
var phrase = "parseint";
var lgth = phrase.length; var checkWin = false; var correct_guess = false; var guess;
var numCols = lgth; new_word = ""; var crazyWord = ""; var new_word = ""; crzLgth = crazyWord.length;
for (var cols = 0; cols < numCols; cols++)
document.getElementById('wheel_game' + cols).innerHTML = ("/ ");
document.getElementById('hWord').innerHTML = "The word was " + (phrase);
while (checkWin === false && count < 10)
{
correct_guess = false;
guess = prompt("Guess a letter");
for (var j = 0; j < lgth; j++)
{
if (guess === phrase.charAt(j))
{
correct_guess = true;
count = count + 1;
document.getElementById('wheel_game' + j).innerHTML = guess;
for (var nw = 0; nw < lgth; nw++)
crazyWord = crazyWord + (document.getElementById('wheel_game' + nw).innerHTML);
}
new_word = crazyWord.substr((crzLgth - lgth), lgth);
checkWin = checkWord(phrase, new_word);
}
if (checkWin === true)
{
document.getElementById("result").innerHTML = ("You win!");
}
else if (checkWin === false)
{
document.getElementById("result").innerHTML = ("You Lose");
if (correct_guess === false)
count = count + 1;
if (count === 10)
{
guess = prompt("One last chance to guess the word");
}
if(guess.length !== 1 && guess !== "parseint") {
break;
}
else if(guess === 'parseint' && guess.length === 8) {
checkWin = true;
document.getElementById("result").innerHTML = ("You win!");
}
}
}
function checkWord(phrase, otherWord)
{
var cleanWord;
cleanWord = otherWord;
if (phrase === cleanWord)
return true;
else
return false;
}
}
Here is my HTML
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="Hangman">
<title>Hangman</title>
</head>
<body>
<h1>Welcome player</h1>
<p> Please Enter your name. </p>
<input type="text" id="player" onchange="myGame();" />
<p id="user_name"> </p> <br>
<div id="wheel_game0"></div> <br>
<div id="wheel_game1"></div> <br>
<div id="wheel_game2"></div> <br>
<div id="wheel_game3"></div> <br>
<div id="wheel_game4"></div> <br>
<div id="wheel_game5"></div> <br>
<div id="wheel_game6"></div> <br>
<div id="wheel_game7"></div> <br>
<div id="wheel_game8"></div> <br>
<div id="wheel_game9"></div> <br>
<div id="hWord"><p></p></div>
<div id="result"><p></p></div>
<script src="myScript_2.js"></script>
</body>
</html>
I tried using a continue statement because I thought that it would skip the iteration of the loop which would keep guessing but unfortunately that did not work. I essentially need the program to prompt the user to guess a letter and than display the letter in place of a dash but for every guess.
Any help would be appreciated.
I have a countdown timer to hide the div then shows another div. i have done this by seconds well , but i want to convert the seconds to minutes and hours.
how can i do this?
pre thanks to anyone answers my question ...
this is my code:
var countDown = 9000;
var i = setInterval(function () {
var b1 = document.getElementById('box1');
var b2 = document.getElementById('box2');
if(countDown === 1) {
if(b1['style'].display == 'none') {
b1['style'].display = 'block';
b2['style'].display = 'none';
} else {
b1['style'].display = 'none';
b2['style'].display = 'block';
}
clearInterval(i);
}
countDown--;
b1.innerHTML = countDown;
}, 1000);
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<div id="box1">9000</div>
<div style="display:none" id="box2">div2</div>
</body>
</html>
Example : https://jsfiddle.net/306qtxot/4/
You can use this Jquery:
var countDown = 9000;
var i = setInterval(function () {
var b1 = document.getElementById('box1');
var b2 = document.getElementById('box2');
if(countDown === 1) {
if(b1['style'].display == 'none') {
b1['style'].display = 'block';
b2['style'].display = 'none';
} else {
b1['style'].display = 'none';
b2['style'].display = 'block';
}
clearInterval(i);
}
countDown--;
//This section convert "seconds" to hour And minute And second
var hour=Math.floor(countDown/3600);
var min=Math.floor(countDown%3600/60);
var sec=Math.floor(countDown%3600%60);
//Format : hh:mm:ss
b1.innerHTML = (hour=hour<10?"0"+hour:hour) + " : " + (min=min<10?"0"+min:min) + " : " + (sec=sec<10?"0"+sec:sec);
}, 1000);
Hi I have to create a HTML table as a chess board that will show where king and queen are by showing a K and a Q in the cells they are in.
The original script I was doing was this;
if (kingX==queenX || kingY==queenY){
alert('In Check!');
}
else if (Math.abs(kingX - queenX)==Math.abs(kingY - queenY)){
alert('In Check!');
}
else{
alert('Not in Check!');
}
You can create elments with document.createElement() and the use appendChild() to append those elements to other, existing elements als last child element:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
var i, j;
var table = document.createElement('table');
document.body.appendChild(table)
for (i = 0; i < 5; i++) {
var row = document.createElement('tr');
table.appendChild(row);
for (j = 0; j < 5; j++) {
var cell = document.createElement('td');
cell.textContent = i * 5 + j;
cell.style.border = 'thin solid black';
row.appendChild(cell);
}
}
</script>
</body>
</html>
Good morning everyone. I tried creating a site that could get information from another page and feed the response into a div tag, but it didnt work. I checked with a very similar one i learnt from. Here is the HTML code.
<html>
<head>
<script>
function checkit(){
var samxml; var username;
if (window.XMLHttpRequest){
samxml = new XMLHttpRequest();}
else {
samxml = new ActiveXObject("Microsoft.XMLHTTP");
}
samxml.onreadystatechange = function() {
if (samxml.readyState == 4 && samxml.status == 200){
document.getElementById("check").innerHTML = samxml.responseText;}
}
username = document.getElementById("username").value;
samxml.open("POST", "check.php",true);
samxml.send( "username" );
}
}
</script>
</head>
<body>
<form>
<label for ="username">User ID:</label>
<input type = "text" name = "username" id = "username"/>
<div id = "check"></div>
<button type = "button" onclick = "checkit()">Check</button>
</form>
</body>
</html>
Here is the PHP page:
//php file
<?php
$user = $_POST["username"];
if ($user == "samuel") {
echo "Hmm. Chosen! Choose another one";}
else {
echo "Nice one";}
?>
Thanks so much.
In his blog post, Christian Cantrell shows how to use STORAGE_VOLUME_MOUNT in ActionScript.
He has written a Flex app called FileTile.
I would like to see a JavaScript alert box that says “You have inserted “ + e.storageVolume.name, and “You have removed a storage volume”.
<html>
<head>
<title>New Adobe AIR Project</title>
<script type="text/javascript" src="lib/air/AIRAliases.js"></script>
<script type="text/javascript" src="lib/air/AIRIntrospector.js"></script>
<script type="text/javascript" src="lib/jQuery/jquery-1.4.3.min.js"></script>
<script type="text/javascript">
var msg = '<h1>Please insert your SwatchDog (SD) card.</h1>';
function trace() {
var message = 'Hello Max';
air.Introspector.Console.log(message);
}
function readFile(v) {
var myFile = air.File.desktopDirectory.resolvePath("MyFile.txt");
var fileStream = new air.FileStream();
fileStream.open(myFile, air.FileMode.READ);
$('#app').append('<p>' + fileStream.readUTFBytes(fileStream.bytesAvailable) + '</p>');
fileStream.close();
}
function onVolumeMount(e) {
$('#app').html('<h1>Thank you</h1><p>I can see you have multiple devices:</p>');
var volumes = air.StorageVolumeInfo.storageVolumeInfo.getStorageVolumes();
for (var i = 0; i < volumes.length; i++) {
$('#app').append(volumes[i].rootDirectory.nativePath);
}
if (e.storageVolume.isRemovable) {
if (e.storageVolume.name == 'SWATCHDOG') {
$('#app').append('<p>And SwatchDog is drive: ' + e.storageVolume.rootDirectory.nativePath + '</p>');
readFile(e.storageVolume)
} else {
$('#app').append('<p>But the one you just plugged in is not SwatchDog.</p>');
}
}
}
function onVolumeUnmount(e) {
$('#app').html('<h1>Goodbye!</h1>' + msg);
}
jQuery(function($){
var PluggedIn = false;
var volumes = air.StorageVolumeInfo.storageVolumeInfo.getStorageVolumes();
for (var i = 0; i < volumes.length; i++) {
if (volumes[i].isRemovable) {
PluggedIn = true;
if (volumes[i].name == 'SWATCHDOG') {
$('#app').append('I see you already have SwatchDog plugged in!');
readFile(volumes[i])
} else {
$('#app').append('What you have plugged in is not SwatchDog.');
}
}
}
if (!PluggedIn){
$('#app').append(msg);
}
air.StorageVolumeInfo.storageVolumeInfo.addEventListener(air.StorageVolumeChangeEvent.STORAGE_VOLUME_MOUNT, onVolumeMount);
air.StorageVolumeInfo.storageVolumeInfo.addEventListener(air.StorageVolumeChangeEvent.STORAGE_VOLUME_UNMOUNT, onVolumeUnmount);
})
</script>
</head>
<body>
<div id="app">
</div>
<button onclick="trace();">Say Hello Max!</button>
</body>
</html>