Dynamically Updating Website Over Time - javascript

I am wondering if someone could give me a brief explanation as to how a site like darebee.com can auto-update its content every day. I understand javascript can be used to create div content through use of arrays but I don't think that is what is going on here.

Related

Multiple modals vs one overwritable modal

I'm trying to set up a page which will have multiple elements in it. Could be something like books galery where when you click on the thumbnail a modal opens up with the picture of the book, link to publisher (or personal book page) and a description.
I was wondering whether it's more prudent to generate 1 modal per thumbnail (no js needed to manage anything and quick setup) or to setup one modal in which that data would be overwritten depending on which thumbnail you're clicking (less html generated but more complex to set up requiring js and storing information somewhere like data attribute).
I've seen a lot of topics and coverage regarding modals but haven't seen question like that asked so far. Everyone seems to be spamming countless modal "elements" without question.
Could someone shed some light on this for me?
The more efficient and future proof approach would be to incorporate JavaScript. As you would only be storing the data for each book and a single template modal this would conserve bandwidth. Additionally, what if you wanted to add more books? Just adding the data to the "books" array would be much easier in the future rather than having to create a new modal for each new entry.
However, if the gallery size is very small it may not be worth the time and effort to do this.
Hence, this is a design choice, it's up to you to decide what would be the ideal approach for your project.

Open same page with different content

I'm working on bookstore website. The main page has all the books. Each has it's own button. Every book has it's button linked to the same page (buy.html), I want change content by clicking on different buttons as every book has it's own description
This is my HTML button code
<button onclick="window.open('buy.html')" class="book4">Buy</button>
I need to open buy.html but with different content according to the book
but what happens now is All buttons show the same content
Can any one help me in this issue,
Thanks.
Though your question is rather broad, I think I get your problem.
You need a way to distinguish between books without creating a new page for every book.
There are multiple ways of doing this. Personally I'd recommend using Server-Side scripts for this but you can also do this with JavaScript, you just have to put it in the link.
An example could be this:
<button onclick="window.open('buy.html?book=4')" class="book4">Buy</button>
What this does is open buy.html and specify what book you want to buy so you can create a function to pull only that description out of the database or however you want to do it.
I strongly recommend a database because as soon as you have a hundred or so books your page will get really slow and it's a waste of resources if you only display one.
The best way to get data out of a URL (as far as I know) is like so
Though, next time please post your code too, that would make it a lot easier to pinpoint the problem.
Good luck.
Edit: The JavaScript that I linked was not the best solution and rather complicated so I think a better and more easily understandable function can be found here

How to make different paragraphs show up after clicking on something

This is my first question here, I'm very new to coding so please forgive me any mistakes.
So i started learning html/css/some basic javascript recently and I'm trying to build a website just for practice. So one page on it looks like this:
https://imgur.com/ZHyeprC
And right now i have different html files for each article (linked under the site navigation: Shauna, The First One etc.), so each name of the article takes you to a different page.
What i want to do is to have multiple articles in just one html file, and make them show up/disappear when the name of the article is clicked.
I tried to figure it out somehow in jquery, but i only managed to wrap the article in a div and make it appear when the invisible div is clicked... which isn't much useful.
So is it posibble to do with simple javascript/jquery? If so, the how do i do this?
Thank you all in advance, Michal.
The most easy and practical way is to have one HTML file for each article. It makes your files more organized and easier to find. Otherwise, if your client just want to look at one article the page has to load all articles which may take longer if the client happens to have a slow internet connection.

Asymptotic Analysis: Populating a long repeated list. HTML vs. JavaScript?

I'm making my portfolio website here,
and I'm wondering if I should replace my LONG HTML5 code that populates my skills/projects/project modals into javascript that runs in a for loop.
I know it won't matter much because it is not like thousands of list elements, but if I take asymptotic approach, would it make difference at all?
I read this thread: Simple html vs Javascript generated html? , but it was still vague to me.
Thank you in advance.
EDIT
Someone voted that this post is unclear about what it's asking. So let me rephrase.
Assume that I'm populating almost infinite number of <li> elements, will HTML5 tags (traditional way) load the page faster, or forloop in a JavaScript load the page faster? Another assumption is that page will be loaded at some point.
Thanks again.
You say an almost infinite number of items. I say you're grossly exaggerating.
Did you ever wonder why Google only shows you the first 10 results? How many times do you look at page 2 of your Google searches? The 3rd page? Ever even seen the 4th?
What's your usual conclusion when you have to go to the 2nd page? Mine is that my query sucks and I try to narrow it down.
There's no way a user is expected to peruse "an almost infinite amount of items" and get any useful information from it. Use a search engine, let people narrow their search (way) down, use paging. And after that's done, use HTML. There's no reason to add another two layers of work (outputting the Javascript code to render + sending the JS data) to just generate the same output in the end.

Dynamic Pages with html5 + XML + JS?

Basically this is the first time when i ASK A QUESTION on stackoverflow. Anyway i will really appreciate if someone can point me to some direction about creating an simple product catalog app using html5+xml+js.
Well the structure is the following:
A: Home page >click> Product Categ >click> List of Products >click> Product Page Description
I'm not sure how shall i create the dynamic pages for the products to be able to extract all the products description from XML whenever click on any of product from the list page.
For example i have 10 products on the page, when i click on product X, an dynamic page with the product X 's (image, description, price) to be created, and so on.
I hope all of these things make sense for you and thanks a lot for your precious time.
For reading XML files using JavaScript, check answers from this question. For HTML5 and JavaScript in general I suggest you to check tutorials for some basics:
JavaScript - http://www.w3schools.com/js/default.asp
HTML5 - http://www.w3schools.com/html/html5_intro.asp
You can also check jQuery library tutorial. And here is jQuery's website.
I think that you should read some basics to learn how to look for more in the web and search for "how-to" connected with specified things you want to do and still don't know where to start.
EDIT:
If you want to check something that you'll need exactly at the beginning, you can check this documentation of addEventListener JavaScript method that will allow you to set action that will be invoked when particular event of the element fires. You can also check links connected to jQuery I mentioned above - jQuery is JavaScript library that makes writing JS simplier. But with both JavaScript and jQuery you have to spend some time reading documentation to know what you can do and how to achieve it.

Categories