Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Ways to change id attribute in html

I'm building a website and I have an unsorted list with some list elements. When I click on some of these list items I want my <body>’s id to change from id="index" to id="collection".

What's the most efficient way to do that?

  1. Should I use JavaScript?
  2. Should I put all the body code in a {% block %} and override it when I click on the special list items?
  3. An other way?
like image 933
thikonom Avatar asked Feb 25 '23 07:02

thikonom


1 Answers

From a purely JavaScript persepctive, the simplest and best way of changing the body's ID is

document.body.id = "collection";

However, you may be better off using a class to avoid any potential conflict of your ID with any other ID in the page. Giving the body an ID doesn't seem terribly useful given that there is only one <body> element in the page and it can be referenced via document.body in JavaScript and body in CSS.

If you want to change an element in the page without reloading the whole page then JavaScript is your only option. If the change is vital to the functionality of your page, you should also provide a non-JavaScript fallback.

like image 51
Tim Down Avatar answered Mar 06 '23 20:03

Tim Down