Looking to showcase the current operating hours for today?

It would be great to feature a box on our upcoming library website showing the operating hours for that day. This way, visitors can easily see when the library is open each day they visit the site. Additionally, I plan to include a link for more extensive information regarding the library's hours.

Although I'm still learning about javascript, I believe this is how we could approach the task. Any guidance in this regard would be highly valued. Thank you!

Answer №1

The JavaScript Date.getDay()[MDN documentation] function provides an integer value ranging from 0 to 6 that signifies the day of the week (where 0 represents Sunday). By creating an array mapping each day to its corresponding hours, you can easily retrieve the operating hours based on the current day.

var dayOfWeek = (new Date).getDay();
var hours = ["Closed",          // Sunday
             "7 AM to 5 PM",    // Monday
             "8 AM to 5 PM",    // Tuesday
             "9 AM to 3 PM",    // Wednesday
             "8 AM to 5 PM",    // Thursday
             "9 AM to 2 PM",    // Friday
             "10 AM to 2 PM"];  // Saturday
var todaysHours = hours[dayOfWeek];

You can view a demonstration of this concept on jsFiddle.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Experiencing difficulty in rendering API within React component

Trying to display an image from a specific API that I came across here. However, encountering the following error in the console... Error with Fetch API: TypeError - this.state.dogs.map is not functioning properly. Code snippet provided below: <htm ...

Enveloping an immediate search within a JavaScript throttle function

Below is a code snippet for a cloud tag (Goat1000) with an instant query. The query part should be enclosed within the throttle function from the underscore.js library to prevent server crashes. <script src="underscore-min.js"></script> &l ...

Transfer a JSON object to a Java Class without relying on a servlet

I have a form in HTML where I collect user input and store it as an object in JavaScript. Here is how I am creating the object: var dataObject = { Name: getName(), Age : getAge() } Now, I want to send this object using Ajax to a b ...

Modify the color of chips when the checkbox is toggled in Materialize CSS

I have been scouring the internet for a solution to my issue. Currently, I am working with materialize css chips and I am trying to achieve a specific functionality. I want the color of the last chip to turn green and the rest to turn red when a checkbox ...

How can I loop through map.entities in Bing Maps v7?

I am working on adding multiple polylines to my map. However, after some logic processing, I need to loop through the map.entities collection to retrieve all the polylines that I have added. var polylineN = new Microsoft.Maps.Polyline(loc); map.entities.p ...

Executing a Firebase JavaScript script on a remote web server client

I have limited experience with Javascript and I am struggling to get my code to execute. I have already completed the Android java portion, but when I attempt to run the html file, nothing happens. I am unsure if there are bugs in my code or if it needs to ...

How to delete the last element of an array in Vue.js

Currently, I'm facing an issue with a filter duplication feature in my code. When I click on the "add filter" button, a duplicated filter is added to the array. However, the problem arises when I try to remove a filter using the cross icon - it always ...

Guide on tallying a unique value of a chosen option within a table using jQuery

I have select elements in my table. I am trying to determine if any of the selected options in those select elements have the value of optional. If any of the select elements has optional selected, then I want to display a text field below it. However, I a ...

Javascript is not executing sequentially

I am experiencing issues with my JavaScript not executing in the correct order during the submit event. My form looks something like this: <form id="myForm"> <div> <button type="submit" name="submit">Submit</button> </di ...

How to use OBJLoader/Three.js to load a specific URL in JavaScript

I am encountering an issue with a JavaScript code snippet from the three.js OBJloader. I should mention that my experience level in JS and PHP is limited as I am just starting out with WordPress websites. My problem lies in utilizing the setPath and load ...

Differences between a readonly variable and a method with a readonly type in TypeScript

Exploring the Contrast Between Readonly Variables and Readonly-Typed Methods in TypeScript Readonly Variable: maxLength: Readonly<Number | number | String | string> = 1; vs Readonly-Typed Method: maxLength(length: Number | number | String | stri ...

Combine an array of arrays with its elements reversed within the same array

I am working with an array of numbers that is structured like this: const arrayOfArrays: number[][] = [[1, 2], [1, 3]]; The desired outcome is to have [[1, 2], [2, 1], [1, 3], [3, 1]]. I found a solution using the following approach: // initialize an e ...

Problem with Bootstrap-slider not loading correctly

I seem to be facing an issue with selecting DOM elements that are part of bootstrap-slider. When I try to target them with events like click, nothing happens. All events work fine when the page is refreshed. What could be causing this problem? $(document ...

What is the process for incorporating Material-UI into a JSFiddle project?

I'm having trouble figuring out how to load and use the Material UI script on platforms like JSFiddle or SO's code editor, even though I can add it with NPM. Check out this JSFiddle example <script src="https://unpkg.com/@material-ui/core/um ...

Rotating images with React

I am encountering an issue with implementing an image carousel in React. Previously, it worked perfectly when I was not using React, but now that I am migrating the page, I am facing an error. ** The carousel is located on the home page: ** const Home = ( ...

Creating a Python server for an Angularjs application and capturing user input

Can you offer me some assistance, whether it's just a hint or a useful tip that could improve my current approach? I have created a series of forms using HTML and AngularJS. Each form collects input data from users, which is then stored in a JSON str ...

What are some ways to display unprocessed image data on a website using JavaScript?

I have an API endpoint that provides image files in raw data format. How can I display this image data on a website using the img tag or CSS background-image property, without utilizing canvas? One possible approach is shown below: $.get({ url: '/ ...

Highcharts - Troubleshooting the chart reflow feature

Take a look at the fiddle I created. I encountered an issue with the chart width when toggling the sidebar. After seeking help on Stack Overflow from this post, I was able to solve it. Now, I'm facing another bug where adding transitions while togg ...

Audio Playlists and Dynamic Loading with WordPress Shortcode

I'm looking to incorporate the wp_audio_shortcode() function using AJAX, and then customize the style of the audio player. However, I'm facing an issue where the HTML code returned by the AJAX request does not allow me to customize the audio play ...

Different or improved strategy for conditional rendering in Angular

Hey there! I've got a few *NgIf conditions in my template that determine which components (different types of forms) are displayed/rendered. For example, in one of my functions (shown below) private _onClick(cell:any){ this._enableView = fals ...