Difference between revisions of "DOM Common Logic"

From ProgZoo
Jump to navigation Jump to search
(Created page with "<pre id='shellbody' data-qtp='clicky'></pre> ==A button== <div class=qu> You must be this tall to ride <pre class=usr> let l = document.createElement('label'); l.innerHTML = '...")
 
Line 24: Line 24:
}
}
document.body.append(b);
document.body.append(b);
</pre>
<pre class=ans>
let l = document.createElement('label');
l.innerHTML = 'Confirm I am at least 1.4m';
let c = document.createElement('input');
c.type = 'checkbox';
l.append(c);
c.id = 'tall';
let b = document.createElement('button');
b.innerText = 'Ride the Rollercoaster';
b.disabled = true;
b.onclick = ()=>{
  document.body.append('Weeee...');
}
c.onclick = ()=>{
  if (c.checked){
    b.removeAttribute('disabled');
  }else{}
    b.addAttribute('disabled');
}
document.body.append(l,b);
</pre>
</pre>
</div>
</div>

Revision as of 13:21, 3 October 2021


A button

You must be this tall to ride

let l = document.createElement('label');
l.innerHTML = 'Confirm I am at least 1.4m';
let c = document.createElement('input');
l.append(c);
c.id = 'tall';
let b = document.createElement('button');
b.innerText = 'Ride the Rollercoaster';
b.disabled = true;
b.onclick = ()=>{
  document.body.append('Weeee...');
}
document.body.append(l,b;
let b = document.createElement('button');
b.innerText = 'click me';
b.onclick = ()=>{
  document.body.append('Hello World!');
}
document.body.append(b);
let l = document.createElement('label');
l.innerHTML = 'Confirm I am at least 1.4m';
let c = document.createElement('input');
c.type = 'checkbox';
l.append(c);
c.id = 'tall';
let b = document.createElement('button');
b.innerText = 'Ride the Rollercoaster';
b.disabled = true;
b.onclick = ()=>{
  document.body.append('Weeee...');
}
c.onclick = ()=>{
  if (c.checked){
    b.removeAttribute('disabled');
  }else{}
    b.addAttribute('disabled');
}
document.body.append(l,b);