OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

JS problem - in-built function "setAttribute()" is not working [closed]

  • Thread starter Thread starter Viru2008
  • Start date Start date
V

Viru2008

Guest
I'm trying to use the function "removeAttribute()" to remove the "hidden" attribute of an HTML class, as can be seen in the line given below:

Code:
perks.removeAttribute("hidden")

The perks class:

Code:
<div class="all_perks" id="perks" hidden>
  <button id="buy_perk" onclick=buy_perk()>Buy a perk</button>
  <div id="perk_cost">Cost: 10B PP</div>
  </br>
  <div id="perk_count">Perks: 0</div>
  <div id="p1">Better crop yield (1x → 3x) <button onclick=perk_add(1)>Buy</button></div>
  <div id="p2">Higher upgrade cap (65 → 105) <button onclick=perk_add(2)>Buy</button></div>
  <div id="p3">More prestige points (1x → 1.5x) <button onclick=perk_add(3)>Buy</button></div>
  <div id="p4">Increased challenge caps (5 → 6) <button onclick=perk_add(4)>Buy</button></div>
  </br>
  <button onclick=perk_respec()>Respec</button>
</div>

I'm using this to make tabs, and the intended function is that pressing the "perks" button shows the perks class and nothing else.

The button:

Code:
<button onclick=open_perks() hidden id="perk_button">Perks</button>

I am not even able to add the hidden attribute to the class (the line given below is how I tried doing it):

Code:
perks.setAttribute("hidden", true)

For all the other tabs, which are formatted in the same way, it works perfectly fine, but not when it comes to the perks class. When I try to click on "perks" it shows absolutely nothing.

I tried importing my code from vscode to replit to try and use the console to debug my code. When I went, I saw the following error messages:

Code:
TypeError: perks.setAttribute is not a function

TypeError: perks.removeAttribute is not a function

I was extremely confused as to why a built-in functionality where I used the same syntax as I did for other classes is shown as "not a function"

Below are some examples of the syntax I used for other classes (which work perfectly fine):

Code:
farm.setAttribute("hidden", true)

farm.removeAttribute("hidden")

As you can see, same syntax as what I did for the perks.setAttribute and perks.removeAttribute functions, yet these functions work fine while the two mentioned functions do not.

<p>I'm trying to use the function "removeAttribute()" to remove the "hidden" attribute of an HTML class, as can be seen in the line given below:</p>
<pre><code>perks.removeAttribute("hidden")
</code></pre>
<p>The perks class:</p>
<pre><code><div class="all_perks" id="perks" hidden>
<button id="buy_perk" onclick=buy_perk()>Buy a perk</button>
<div id="perk_cost">Cost: 10B PP</div>
</br>
<div id="perk_count">Perks: 0</div>
<div id="p1">Better crop yield (1x → 3x) <button onclick=perk_add(1)>Buy</button></div>
<div id="p2">Higher upgrade cap (65 → 105) <button onclick=perk_add(2)>Buy</button></div>
<div id="p3">More prestige points (1x → 1.5x) <button onclick=perk_add(3)>Buy</button></div>
<div id="p4">Increased challenge caps (5 → 6) <button onclick=perk_add(4)>Buy</button></div>
</br>
<button onclick=perk_respec()>Respec</button>
</div>
</code></pre>
<p>I'm using this to make tabs, and the intended function is that pressing the "perks" button shows the perks class and nothing else.</p>
<p>The button:</p>
<pre><code><button onclick=open_perks() hidden id="perk_button">Perks</button>
</code></pre>
<p>I am not even able to add the hidden attribute to the class (the line given below is how I tried doing it):</p>
<pre><code>perks.setAttribute("hidden", true)
</code></pre>
<p>For all the other tabs, which are formatted in the same way, it works perfectly fine, but not when it comes to the perks class. When I try to click on "perks" it shows absolutely nothing.</p>
<p>I tried importing my code from vscode to replit to try and use the console to debug my code. When I went, I saw the following error messages:</p>
<pre><code>TypeError: perks.setAttribute is not a function

TypeError: perks.removeAttribute is not a function
</code></pre>
<p>I was extremely confused as to why a built-in functionality where I used the same syntax as I did for other classes is shown as "not a function"</p>
<p>Below are some examples of the syntax I used for other classes (which work perfectly fine):</p>
<pre><code>farm.setAttribute("hidden", true)

farm.removeAttribute("hidden")
</code></pre>
<p>As you can see, same syntax as what I did for the perks.setAttribute and perks.removeAttribute functions, yet these functions work fine while the two mentioned functions do not.</p>
 

Latest posts

Top