Klaidų paieška DOM kode su JavaScript
Šiose užduotyse tam tikras programuotojas parašė kodą ir galbūt padarė jame klaidų. Jūs turite patikrinti, ar kodas daro tai, kas aprašyta. Jei kodas veikia neteisingai, turite ištaisyti klaidas.
Kodas turi pridėti tekstą į kiekvienos pastraipos pabaigą:
html<p>1</p>
<p>2</p>
<p>3</p>javascriptlet elems = document.querySelector('p');
elems.textContent += '!';
Paspaudus ant pastraipos, jos reikšmė turi padidėti vienetu:
html<p>1</p>
<p>2</p>
<p>3</p>javascriptlet elems = document.querySelectorAll('p');
for (let elem of elems) {
elem.addEventListener('click', function() {
this.textContent += Number(1);
});
}
Paspaudus ant mygtuko, pastraipos tekstas turi tapti paryškintu:
html<p>text</p>
<button>click</button>javascriptlet button = document.querySelector('button');
let elem = document.querySelector('p');
button.addEventListener('click', function() {
elem.innerHTML = '<b>elem.innerHTML</b>';
});
Paspaudus ant mygtuko, turi būti išvesta skaičių iš pastraipų suma:
html<p>1</p>
<p>2</p>
<p>3</p>
<button>click</button>javascriptlet button = document.querySelector('button');
let elems = document.querySelector('p');
button.addEventListener('click', function() {
let sum = 0;
for (let elem of elems) {
sum += Number(elems.textContent);
}
console.log(sum);
});
Paspaudus ant pastraipos, į jos pabaigą turi būti pridėtas nurodytas tekstas:
html<p>1</p>
<p>2</p>
<p>3</p>javascriptlet elems = document.querySelectorAll('p');
for (let elem of elems) {
elem.addEventListener('click', () => {
this.textContent += '!';
});
}
Paspaudus ant mygtuko, kiekvienos pastraipos tekstas turi tapti paryškintu:
html<p>text1</p>
<p>text2</p>
<p>text3</p>
<button>click</button>javascriptlet button = document.querySelector('button');
let elems = document.querySelectorAll('p');
button.addEventListener('click', function() {
for (let elem of elems) {
elem.innerHTML = '<b>+elem.innerHTML+</b>';
}
});
Paspaudus ant mygtuko, į konsolę turi būti išvesta skaičių iš pastraipų suma:
html<p>1</p>
<p>2</p>
<p>3</p>
<button>click</button>javascriptlet button = document.querySelector('button');
let elems = document.querySelectorAll('p');
let sum = 0;
for (let elem of elems) {
sum = elem.textContent + 1;
button.addEventListener('click', function() {
console.log(sum);
});
}
Į input laukus įvedami skaičiai. Paspaudus ant mygtuko į konsolę turi būti išvesta skaičių iš input laukų suma:
html<input>
<input>
<input>
<button>click</button>javascriptlet button = document.querySelector('button');
let elems = document.querySelectorAll('input');
let sum = 0;
for (let elem of elems) {
sum += elem.value;
}
button.addEventListener('click', function() {
console.log(sum);
});
Į pirmus du input laukus įvedami skaičiai. Paspaudus ant mygtuko į trečią input lauką turi būti išvesta šių skaičių suma:
html<input id="inp1">
<input id="inp2">
<input id="inp3">
<button id="btn">click</button>javascriptlet btn = document.querySelector('#btn');
let inp1 = document.querySelector('#inp1');
let inp2 = document.querySelector('#inp2');
let inp3 = document.querySelector('#inp3');
btn.addEventListener('click', function() {
inp3.textContent = inp1.textContent + inp2.textContent;
});
Į pirmus du input laukus įvedami skaičiai. Paspaudus ant mygtuko į pastraipą turi būti išvesta šių skaičių suma:
html<input id="inp1">
<input id="inp2">
<p id="res"></p>
<button id="btn">click</button>javascriptlet btn = document.querySelector('btn');
let res = document.querySelector('res');
let inp1 = document.querySelector('inp1');
let inp2 = document.querySelector('inp2');
button.addEventListener('click', function() {
res.value = inp1.value + inp2.value;
});
Paspaudus ant mygtuko reikia patikrinti, ar tekstas kiekviename input lauke atitinka jo data atributo tekstą:
html<input data-text="text1">
<input data-text="text2">
<input data-text="text3">
<button id="btn">click</button>javascriptlet inputs = document.querySelectorAll('input')
let button = document.querySelector('#button')
button.addEventListener('click',function() {
for (let input of inputs) {
if (input.value === input.dataset) {
input.classList.add('right')
} else {
input.classList.add('wrong')
}
}
});
Paspaudus ant mygtuko reikia patikrinti, ar tekstas kiekviename input lauke atitinka atitinkamo masyvo elemento tekstą:
html<input>
<input>
<input>
<button id="btn">click</button>javascriptlet inputs = document.querySelectorAll('input')
let button = document.querySelector('#button')
let texts = [
'text1',
'text2',
'text3',
];
button.addEventListener('click',function() {
for (let input of inputs) {
for (let text of texts) {
if (input.value === text) {
input.classList.add('right')
} else {
input.classList.add('wrong')
}
}
}
});
Į input laukus įvedami skaičiai. Paspaudus ant mygtuko į konsolę turi būti išvesta įvestų skaičių suma:
html<input>
<input>
<input>
<button id="btn">click</button>javascriptlet inputs = document.querySelectorAll('inputs');
let btn = document.querySelector('#btm');
let sum = 0;
btn.addEventListener('click', function() {
for (let input of inputs) {
sum += Number(input);
}
console.log(sum);
});
Į pirmus du input laukus įvedami skaičiai. Paspaudus ant mygtuko į trečią input lauką turi būti išvesta šių skaičių suma:
html<input id="inp1">
<input id="inp2">
<input id="inp3">
<button id="btn">click</button>javascriptlet btn = document.querySelector('#btn');
let inp1 = document.querySelector('#inp1');
let inp2 = document.querySelector('#inp2');
let inp3 = document.querySelector('#inp3');
let sum = inp1.value + inp2.value;
btn.addEventListener('click', function() {
inp3.value = sum;
});
Į input lauką įvedamas skaičius. Praradus fokusą į konsolę turi būti išvesta šio skaičiaus skaitmenų suma:
html<input id="inp">javascriptlet inp = document.querySelector('#inp').value;
inp.addEventListener('blur', function() {
let digits = +inp.split('');
let sum = 0;
for (let digit of digits) {
sum += digit;
}
console.log(sum);
});