Thursday, 14 August 2025

Let and Var Loop Are Different

______________________________________________

Let Loop Var Loop Are Different when We 

Use Let loop We Can Use buttons[i]or this 

buttons[i].style.visibility = "hidden";

this.style.visibility = "hidden";

But when We Use Var Loop

for (var i = 0; i < buttons.length; i++) {

We Can Only Use 

this.style.visibility = "hidden";

We Can Write button Query selector line

var buttons = [ ...document.querySelectorAll('[id="btn1"]'), ...document.querySelectorAll('[id="btn2"]')  ];


Or Write In This Way 

var buttons = Array.from(document.querySelectorAll("#btn1,#btn2"));


Or Write In This Way 

var buttons = document.querySelectorAll("#btn1,#btn2");


Or  Write In This Way

var allButtons = document.querySelectorAll("button");

var btn1 = allButtons[0];

var btn1_again = allButtons[1];

var btn2 = allButtons[2];

var btn2_again = allButtons[3];

var buttons = [btn1, btn1_again, btn2, btn2_again];


Or Write In This Way 

var btn1Elements = document.querySelectorAll('[id="btn1"]'); 

var btn2Elements = document.querySelectorAll('[id="btn2"]'); 

var buttons = [

btn1Elements[0], // First btn1

btn1Elements[1], // Second btn1

btn2Elements[0], // First btn2

btn2Elements[1]  // Second btn2

];

______________________________________________

We Use Simple Button Click Function With Argument Button 

<button id="btn1">Button 1</button>

<script>

btn1.onclick = function() {

btn1.style.visibility = 'hidden';

//  Or Use this

//this.style.visibility = 'hidden';

}

</script>

______________________________________________

<button id="btn1" onclick="Fn1(this)">Button 1</button>

<button id="btn1" onclick="Fn1(this)">Button 1</button>

<script>

function Fn1(button) {

button.style.visibility = 'hidden';

}

</script>

___________________________________________________

<button id="btn1">Button 1</button>

<button id="btn1">Button 1</button>

<button id="btn2">Button 2</button>

<button id="btn2">Button 2</button>

<script>

var buttons=document.querySelectorAll("button")

for (let i = 0; i < buttons.length; i++) {

buttons[i].onclick = function() {

buttons[i].style.visibility = "hidden";

};

}

</script>

___________________________________________________

0 comments:

Post a Comment

FB Gadgets | Template Designed by Fatakat PhotosCoolBThemes.com
Code by : paid web directory

https://www.google.co.uk/search?q=site%3Ablogspot.com+fbgadgets