Using href to pass argument in HTML

Question

I can use the following line in html to pass a static value with a link

<button class="light" id = "pg1" onclick="window.location.href = '1.html?theme=light';">page 1</button>

Here I have appended ?theme=light so I can later retrieve the value of theme in 1.html

My question: Is there a way for me to send the class variable itself?

i.e, if class="dark" is there a way I can send theme as ?theme=dark without changing the parameter myself?

Answer 1

You must read the class of the current object using a JS function (you're already using JavaScript in the onClick event):

<script type="text/javascript">
  function setLink(obj){
    window.location.href = '1.html?theme=' + obj.className;
  }
</script>

<button class="light" id = "pg1" onclick="setLink(this);">page 1</button>