Hi I need those two to show in the same line(Now they show one after another). I tried many things but nothing works.
document.write();
var day = new Date();
var hr = day.getHours();
if ((hr == 1) || (hr == 2) || (hr == 3) || (hr == 4) || (hr == 5) || (hr ==
6) || (hr == 7) || (hr == 8) || (hr == 9) || (hr == 10) || (hr == 11) ||
(hr == 12)) {
document.write("Good Morning!");
}
if ((hr == 13) || (hr == 14) || (hr == 15) || (hr == 16) || (hr == 17)) {
document.write("Good Afternoon!");
}
if ((hr == 18) || (hr == 19) || (hr == 20) || (hr == 21) || (hr == 22) ||
(hr == 23) || (hr == 24)) {
document.write("Good Evening!");
}
document.write();
/*--------------------------------------------------------------------------
---------------------------*/
function myFunction() {
var person = prompt("Please enter your name", "Harry Potter");
if (person != null) {
document.getElementById("demo").innerHTML =
person;
}
}
Is this what you are looking for:
<html>
<body onload="myFunction()">
<div id="demo"></div>
<script>
function myFunction() {
var day = new Date();
var hr = day.getHours();
var greeting;
var person = prompt("Please enter your name", "Harry Potter");
if (person != null) {
if ( hr <= 12 ) {
greeting = "Good morning " + person;
} else if ( hr <= 18 ) {
greeting = "Good afternoon " + person;
} else {
greeting = "Good evening " + person;
}
document.getElementById("demo").innerHTML = greeting;
}
}
</script>
</body>
</html>
I hope this'll Help you. i also done code optimization for if
Conditions.
You have to invoke myfunction method
<body>
<span id="demo"></span>
<script>
(function () {
var person = prompt("Please enter your name", "Harry Potter");
if (person != null) {
document.write();
var day = new Date();
var hr = day.getHours();
if ((hr >= 1) && (hr <= 12)) {
person = person + " Good Morning!";
}
else if ((hr >= 13) && (hr <= 17)) {
person = person + " Good Afternoon!";
}
else if ((hr >= 18) && (hr <= 24)) {
person = person + "Good Evening!" ;
}
document.getElementById("demo").innerHTML = person;
}
})()
</script>
</body>
document.write() does not add a new line to document but rather changes your document element to the content, where as document.getElementById() refers to specific element in the DOM. Anyway here is my
javascript:
function greeting() {
var person = prompt("Please enter your name", "Harry Potter");
if (person != null) {
// Set hr to current hour
var hr = new Date().getHours();
// Tests current hour
if (hr > 0 && hr < 13) {
document.write("Good Morning! " + person);
} else if (hr > 12 && hr < 18) {
document.write("Good Afternoon! " + person);
} else if (hr > 17 && hr < 25) {
document.write("Good Evening! " + person);
}
}
}
Related
I am fairly new to JS and don't know much.
So I tried to make a simple countdown for work, so I can see how long I have to work. It takes the actual time and just subtracts it from the time till I have to work. So very simple.
When I keep the website open for more than 20 mins, it crashes and Chrome/Edge/Firefox displays the ERROR message: ''SBOX_FATAL_MEMORY_EXCEEDED".
I think, due to the fact, that I am recalling the function with an unaccasary amount of ifs, the Browser gets drained quickly out of memory. That's at least what I think. But I can not get it to work. Nevermind how I rewrite my function, it still crashes.
Would be happy if someone can help me, or link me a similar StackOverflow question, 'cause the few results for this error in combination with js didn't help me.
Here is the JS code:
//CSS ELEMETNS
var helloText = document.getElementById("welcomeText");
var textFiller = document.getElementById("fillerText");
var countdown = document.getElementById("countdown");
var motivationText = document.getElementById("motivationText");
var btn = document.getElementById("button");
//JS VARs
let date, hrs, mins, secs;
let date = new Date();
//main function to check which day it is, and which function to call
function clock() {
let day = date.getDay());
if (day == 0 || day == 6) {
weekend();
} else if (day == 5) {
friday();
} else {
otherDay();
}
}
//Text to display if it is sun or sat
function weekend() {
helloText.innerHTML = "Juhu!";
countdown.innerHTML = "Es ist Wochenende!";
textFiller.innerHTML = "";
btn.style.display = "none";
}
//Function to execute when it is friday
function friday() {
hrs = date.getHours();
mins = date.getMinutes();
secs = date.getSeconds();
hrs = hrs < 10 ? `0${hrs}` : hrs;
mins = mins < 10 ? `0${mins}` : mins;
secs = secs < 10 ? `0${secs}` : secs;
if (hrs >= 14 || hrs < 7) {
if ((((helloText.innerHTML != "Yeah!" &&
countdown.innerHTML != "You can go home!") &&
textFiller.innerHTML != "") &&
btn.style.display != "none")) {
helloText.innerHTML = "Yeah!";
countdown.innerHTML = "You can go home!";
textFiller.innerHTML = "";
btn.style.display = "none";
}
} else {
if (hrs < 10) {
if (helloText.innerHTML != "Good Morning!" &&
motivationText.innerHTML !=
"Man, it is still early in the morning...") {
helloText.innerHTML = "Good Morning!";
motivationText.innerHTML =
"Man, it is still early in the morning...";
}
}
if (hrs == 10 || hrs > 10) {
if (helloText.innerHTML != "Hello!" &&
motivationText.innerHTML !=
"Stay concentrated! The morning is already over!") {
helloText.innerHTML = "Hello!";
motivationText.innerHTML =
"Stay concentrated! The morning is already over!";
}
}
if (hrs == 12 || hrs > 12) {
if (motivationText.innerHTML != "You almost got it!") {
motivationText.innerHTML = "You almost got it!";
}
}
if (hrs == 13 || hrs > 13) {
if (motivationText.innerHTML !=
"Finally! The last hour!") {
motivationText.innerHTML =
"Finally! The last hour!";
}
}
hrs = 13 - hrs;
mins = 59 - mins;
secs = 60 - secs;
if (hrs < 10) {
hrs = "0" + hrs;
}
if (mins < 10) {
mins = "0" + mins;
}
if (secs < 10) {
secs = "0" + secs;
}
let time = `${hrs}:${mins}:${secs}`;
setInterval(clock, 1000);
countdown.innerText = time;
}
}
//otherday() is the same as friday(), just with different hours
Your script was not working at all
This works. Take it from there
I moved the setInterval outside all functions and new Date inside clock
//CSS ELEMETNS
var helloText = document.getElementById("welcomeText");
var textFiller = document.getElementById("fillerText");
var countdown = document.getElementById("countdown");
var motivationText = document.getElementById("motivationText");
var btn = document.getElementById("button");
//JS VARs
let date, hrs, mins, secs;
//main function to check which day it is, and which function to call
function clock() {
date = new Date();
let day = date.getDay();
if (day == 0 || day == 6) {
weekend();
} else if (day == 5) {
friday();
} else {
// otherDay();
friday()
}
//Text to display if it is sun or sat
function weekend() {
helloText.innerHTML = "Juhu!";
countdown.innerHTML = "Es ist Wochenende!";
textFiller.innerHTML = "";
btn.style.display = "none";
}
//Function to execute when it is friday
function friday() {
hrs = date.getHours();
mins = date.getMinutes();
secs = date.getSeconds();
hrs = hrs < 10 ? `0${hrs}` : hrs;
mins = mins < 10 ? `0${mins}` : mins;
secs = secs < 10 ? `0${secs}` : secs;
let time = `${hrs}:${mins}:${secs}`;
countdown.innerText = time;
if (hrs >= 14 || hrs < 7) {
if ((((helloText.innerHTML != "Yeah!" &&
countdown.innerHTML != "You can go home!") &&
textFiller.innerHTML != "") &&
btn.style.display != "none")) {
helloText.innerHTML = "Yeah!";
countdown.innerHTML = "You can go home!";
textFiller.innerHTML = "";
btn.style.display = "none";
}
} else {
if (hrs < 10) {
if (helloText.innerHTML != "Good Morning!" &&
motivationText.innerHTML !=
"Man, it is still early in the morning...") {
helloText.innerHTML = "Good Morning!";
motivationText.innerHTML =
"Man, it is still early in the morning...";
}
}
if (hrs == 10 || hrs > 10) {
if (helloText.innerHTML != "Hello!" &&
motivationText.innerHTML !=
"Stay concentrated! The morning is already over!") {
helloText.innerHTML = "Hello!";
motivationText.innerHTML =
"Stay concentrated! The morning is already over!";
}
}
if (hrs == 12 || hrs > 12) {
if (motivationText.innerHTML != "You almost got it!") {
motivationText.innerHTML = "You almost got it!";
}
}
if (hrs == 13 || hrs > 13) {
if (motivationText.innerHTML !=
"Finally! The last hour!") {
motivationText.innerHTML =
"Finally! The last hour!";
}
}
hrs = 13 - hrs;
mins = 59 - mins;
secs = 60 - secs;
if (hrs < 10) {
hrs = "0" + hrs;
}
if (mins < 10) {
mins = "0" + mins;
}
if (secs < 10) {
secs = "0" + secs;
}
}
}
}
setInterval(clock, 1000);
//otherday() is the same as friday(), just with different hours
<span id="welcomeText"></span>
<span id="fillerText"></span>
<span id="motivationText"></span>
<span id="countdown"></span>
<button type="button" id="button">Button</button>
I'm trying to show a link only at certain times of the day.
The link is visible within Adobe Muse, but is hidden on browser.
Here's my code
<script type="text/javascript">
var day= new Date();
var hr= day.getUTCHours();
if ((hr == 0) || (hr == 1) || (hr == 2) || (hr == 3) || (hr == 4) || (hr == 5) || (hr == 6) || (hr == 7) || (hr == 8) || (hr == 9) || (hr == 10) || (hr == 11) || (hr == 12) || (hr == 13) || (hr == 22) || (hr == 23)) { var a = document.createElement('a'); var linkText = document.createTextNode("Example"); a.appendChild(linkText); a.title = "Example"; a.style.fontSize = "16px"; a.style.color="#C31E2F"; a.href = "http://www.example.com/"; document.body.appendChild(a);}
if ((hr == 14) || (hr == 15) || (hr == 16) || (hr == 17) || (hr == 18) || (hr == 19) || (hr == 20) || (hr == 21)) { document.write("<br><font>CALL TOLL FREE:xxx-xxx-xxxx</font></br>");}
What do you mean it's hidden? This script is getting time from your device local time. If it's correct, you should get correct result.
<script type="text/javascript">
var day= new Date();
var hr= day.getUTCHours();
if ((hr>=0 && hr<13) || (hr>=22 && hr<=23)) {
var a = document.createElement('a');
var linkText = document.createTextNode("Example");
a.appendChild(linkText); a.title = "Example";
a.style = "font-size: 16px; #C31E2F; color: #C31E2F";
a.href = "http://www.example.com/";
document.body.appendChild(a);
} else {
var out=document.createElement("P");
out.innerHTML = "<br>CALL TOLL FREE:xxx-xxx-xxxx</br>";
document.body.appendChild(out);
}
</script>
Ended up trashing most of the existing code. I think document.createElement was causing the problem.
Here's what I'm using instead.
<script type="text/javascript">
var day= new Date();
var hr= day.getUTCHours();
if ((hr>=0 && hr<13) || (hr>=22 && hr<=23)) {
document.write('<font>Example</font>'.link('http://www.example.com/')); }
else { document.write("<font>CALL TOLL FREE:xxx-xxx-xxxx</font>"); }
The code changes the new Date() to DayHourMinute
e.g. monday9AM45minutes to 010945
What I use is 010945 and my code specifies
if the var is between >=010921 && <=011010
change the background to green else nothing
But nothing happens and if I use alert(Time) it gives the message 010945.
How can if fix this?
Code:
function one() {
now = new Date();
hour = "" + now.getHours();
if (hour.length == 1) {
hour = "0" + hour;
}
minute = "" + now.getMinutes();
if (minute.length == 1) {
minute = "0" + minute;
}
day = "" + now.getDay();
if (day.length == 1) {
day = "0" + day;
}
var Time = day + '' + hour + '' + minute;
if (Time >= 010835 && Time <= 010920) {
document.getElementById('Man1').style.background = 'green';
} else {
document.getElementById('Man1').style.background = '';
}
if (Time >= 010921 && Time <= 011010) {
document.getElementById('Man2').style.background = 'green';
} else {
document.getElementById('Man2').style.background = '';
}
if (Time >= 011011 && Time <= 011105) {
document.getElementById('Man3').style.background = 'green';
} else {
document.getElementById('Man3').style.background = '';
}
if (Time >= 011106 && Time <= 011155) {
document.getElementById('Man4').style.background = 'green';
} else {
document.getElementById('Man4').style.background = '';
}
if (Time >= 011156 && Time <= 011239) {
document.getElementById('Man5').style.background = 'green';
} else {
document.getElementById('Man5').style.background = '';
}
if (Time >= 011240 && Time <= 011325) {
document.getElementById('Man6').style.background = 'green';
} else {
document.getElementById('Man6').style.background = '';
}
if (Time >= 011326 && Time <= 011415) {
document.getElementById('Man7').style.background = 'green';
} else {
document.getElementById('Man7').style.background = '';
}
if (Time >= 011416 && Time <= 011505) {
document.getElementById('Man8').style.background = 'green';
} else {
document.getElementById('Man8').style.background = '';
}
if (Time >= 011506 && Time <= 011555) {
document.getElementById('Man9').style.background = 'green';
} else {
document.getElementById('Man9').style.background = '';
}
}
setInterval(one, 1000);
Fiddle
Time is a string, and you are comparing to an int. Put the values in quotes:
if ( Time>='020000' && Time<='030000' ){
I have a function with a stream of if statements. If a statement is true, it writes back to the document using innerHTML. Within the innerHTML I can add p tags and text, but as soon as I add an <a href> line it give me an "Uncaught SyntaxError: Unexpected identifier" error. What am I doing wrong? The error is within the calage() function with the following snippet:
if((calyear == 2010 && calmon > 10) || (calyear == 2011 && calmon < 11)) {
console.log("They should be in the 2YO");
document.getElementById("demo").innerHTML="<p>Your student would more than likely enter the 2YO class. The 2YO students will have class at the Nanshan campus. To apply, please fill out the following application.</p> QSI Shekou!";
}
The full HTML file is below. Thank you for your help!
<!DOCTYPE HTML>
<html>
<head> </head>
<body>
<table cellpadding=0 cellspacing=0 style="width:95%;" align="center">
<tr><td align="center" class="abouttabletext"><br>
<script type="text/javascript">
var startyear = "1995";
var endyear = "2013";
var dat = new Date();
var curday = dat.getDate();
var curmon = dat.getMonth()+1;
var curyear = dat.getFullYear();
function checkleapyear(datea)
{
if(datea.getYear()%4 == 0)
{
if(datea.getYear()% 10 != 0)
{
return true;
}
else
{
if(datea.getYear()% 400 == 0)
return true;
else
return false;
}
}
return false;
}
function DaysInMonth(Y, M) {
with (new Date(Y, M, 1, 12)) {
setDate(0);
return getDate();
}
}
function datediff(date1, date2) {
var y1 = date1.getFullYear(), m1 = date1.getMonth(), d1 = date1.getDate(),
y2 = date2.getFullYear(), m2 = date2.getMonth(), d2 = date2.getDate();
if (d1 < d2) {
m1--;
d1 += DaysInMonth(y2, m2);
}
if (m1 < m2) {
y1--;
m1 += 12;
}
return [y1 - y2, m1 - m2, d1 - d2];
}
function calage()
{
var calday = document.birthday.day.options[document.birthday.day.selectedIndex].value;
var calmon = document.birthday.month.options[document.birthday.month.selectedIndex].value;
var calyear = document.birthday.year.options[document.birthday.year.selectedIndex].value;
if(curday =="" || curmon=="" || curyear=="" || calday=="" || calmon=="" || calyear=="")
{
alert("please fill all the values and click go -");
}
else
{
var curd = new Date(curyear,curmon-1,curday);
var cald = new Date(calyear,calmon-1,calday);
var diff = Date.UTC(curyear,curmon,curday,0,0,0) - Date.UTC(calyear,calmon,calday,0,0,0);
var dife = datediff(curd,cald);
var monleft = (dife[0]*12)+dife[1];
var secleft = diff/1000/60;
var hrsleft = secleft/60;
var daysleft = hrsleft/24;
var as = parseInt(calyear)+dife[0]+1;
var datee = diff/1000/60/60/24;
}
if((calyear == 2010 && calmon > 10) || (calyear == 2011 && calmon < 11)) {
console.log("They should be in the 2YO");
document.getElementById("demo").innerHTML="<p>Your student would more than likely enter the 2YO class. The 2YO students will have class at the Nanshan campus. To apply, please fill out the following application.</p> Visit W3Schools!";
}
if((calyear == 2009 && calmon > 10) || (calyear == 2010 && calmon < 11)) {
console.log("They should be in the 3YO");
return 3;
}
if((calyear == 2008 && calmon > 10) || (calyear == 2009 && calmon < 11)) {
console.log("They should be in the 4YO");
}
if((calyear == 2007 && calmon > 10) || (calyear == 2008 && calmon < 11)) {
console.log("They should be in the 5YO");
}
if((calyear == 2006 && calmon > 10) || (calyear == 2007 && calmon < 11)) {
console.log("They should be in the 6YO");
}
if((calyear == 2005 && calmon > 10) || (calyear == 2006 && calmon < 11)) {
console.log("They should be in the 7YO");
}
if((calyear == 2004 && calmon > 10) || (calyear == 2005 && calmon < 11)) {
console.log("They should be in the 8YO");
}
if((calyear == 2003 && calmon > 10) || (calyear == 2004 && calmon < 11)) {
console.log("They should be in the 9YO");
}
if((calyear == 2002 && calmon > 10) || (calyear == 2003 && calmon < 11)) {
console.log("They should be in the 10YO");
}
if((calyear == 2001 && calmon > 10) || (calyear == 2002 && calmon < 11)) {
console.log("They should be in the 11YO");
}
if((calyear == 2000 && calmon > 10) || (calyear == 2001 && calmon < 11)) {
console.log("They should be in the 12YO");
}
if((calyear == 1999 && calmon > 10) || (calyear == 2000 && calmon < 11)) {
console.log("They should be in the 13YO");
}
if((calyear == 1998 && calmon > 10) || (calyear == 1999 && calmon < 11)) {
console.log("They should be in the 14YO");
}
if((calyear == 1997 && calmon > 10) || (calyear == 1998 && calmon < 11)) {
console.log("They should be in the 15YO");
}
if((calyear == 1996 && calmon > 10) || (calyear == 1997 && calmon < 11)) {
console.log("They should be in the 16YO");
}
if((calyear == 1995 && calmon > 10) || (calyear == 1996 && calmon < 11)) {
console.log("They should be in the 17YO");
}
if(calyear == 1995 && calmon < 11) {
console.log("Your child is too old to attend QSI");
}
}
</script>
<form name="birthday" action="">
Date<select name="day" size="1">
<script type="text/javascript">
for(var j=1;j<32;j++)
document.write("<option value="+j+">"+j+"</option>");
</script></select>
Month<select name="month" size="1">
<script type="text/javascript">
for(var i=1;i<13;i++)
document.write("<option value="+i+">"+i+"</option>");
</script></select>
Year
<select name="year" size="1">
<script type="text/javascript">
for(var k=startyear;k<endyear;k++)
document.write("<option value="+k+">"+k+"</option>");
</script></select>
<br><br>
<input name="start" onclick="calage()" value="Calculate" type="button">
</form>
</td></tr></table>
<div id="demo">
</div>
</body>
</html>
try this:
document.getElementById("demo").innerHTML="<p>Your student would more than likely enter the 2YO class. The 2YO students will have class at the Nanshan campus. To apply, please fill out the following application.</p> <a href='http://qsishekou.org' target='_blank'>QSI Shekou!</a>";
enclose the string with "", like you have - so use ' to surround attributes.
for example:
var str = "hello, I am" gonna go" here";
that will generate an error because you close the string and then you don't concatenate, thus the exception.
so,
var str = "hello, I am' gonna go' here";
would be appropriate.
or
var str = "hello, I am" + "gonna go here";
or if you have to use double quotes, then backslash them.
var str = "hello, I am\" gonna go\" here";
In my case, I already used simple quotes as #jamesemanon suggests, but it still didn't work. In Android devices no problem, IOS simulator no problem, but IOS devices failed.
The solution for me was just remove the target="_blank" attr, and link work now on devices.
How do you make something with JavaScript that when your time is below 12 o'clock, it says "good morning!" and when it is after 12 o'clock, it says "good afternoon!"?
Here it is!
var d = new Date();
var time = d.getHours();
if (time < 12) {
document.write("<b>Good morning!</b>");
}
if (time > 12) {
document.write("<b>Good afternoon!</b>");
}
if (time == 12) {
document.write("<b>Go eat lunch!</b>");
}
const date = new Date;
let hours = date.getHours();
let status = (hours < 12)? "Morning" :
((hours <= 18 && hours >= 12 ) ? "Afternoon" : "Night");
console.log(status);
The following should work:
var hours = new Date().hours;
if(hours > 12){
alert("Good Afternoon!");
}
else{
alert("Good Morning!");
}
Just for fun, here's a one liner:
(new Date().hours > 12) ? alert("Good Afternoon!") : alert("Good Morning!");
Working Demo
<SCRIPT LANGUAGE="JavaScript">
currentTime=new Date();
//getHour() function will retrieve the hour from current time
if(currentTime.getHours()<12)
document.write("<b>Good Morning!! </b>");
else if(currentTime.getHours()<17)
document.write("<b>Good Afternoon!! </b>");
else
document.write("<b>Good Evening!! </b>");
</SCRIPT>
//if hour is between 6am-12pm ,print good morning
//if hour is between 12pm-6pm ,print good afternoon
//else good evening
let hour = 5;
if(hour>=6 && hour<12) {
console.log('Good Morning')
}
else if(hour>+12 && hour<18) {
console.log('Good Afternoon')
}
else {
console.log('Good Evening')
}
<script type="text/javascript">
document.write("<h2>");
var day = new Date();
var hr = day.getHours();
if (hr >= 4 && hr < 12) {
document.write("Goedenmorgen");
} else if (hr == 12) {
document.write("Goedemiddag");
} else if (hr >= 12 && hr <= 16) {
document.write("Goedemiddag");
} else if (hr >= 16 && hr <= 23) {
document.write("Goedenavond");
} else {
document.write("Goedennacht");
}
document.write("</h2>");
</script>