DOM-ի հետ JavaScript-ում կոդի սխալների որոնում

Հաջորդ առաջադրանքներում ինչ-որ ծրագրավորող գրել է կոդ և, հնարավոր է, թույլ տվել դրանում սխալներ: Դուք պետք է ստուգեք, արդյոք կոդը անում է նշվածը: Եթե կոդը աշխատում է ոչ ճիշտ, դուք պետք է ուղղեք սխալները:

Задание 1

Կոդը պետք է ավելացնի տեքստ յուրաքանչյուր պարբերության վերջում՝ յուրաքանչյուր պարբերության վերջում:

html<p>1</p>
<p>2</p>
<p>3</p>
javascriptlet elems = document.querySelectorAll('p');
for (let elem of elems) {
  elem.textContent += '!';
}
Задание 2

Պարբերության վրա կտտացնելիս նրա արժեքը պետք է ավելանա մեկով:

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(this.textContent) + 1;
  });
}
Задание 3

Կոճակի վրա կտտացնելիս պարբերության տեքստը պետք է դառնա թավ:

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.textContent + '</b>';
});
Задание 4

Կոճակի վրա կտտացնելիս պետք է արտածվի պարբերությունների թվերի գումարը:

html<p>1</p>
<p>2</p>
<p>3</p>

<button>click</button>
javascriptlet button = document.querySelector('button');
let elems  = document.querySelectorAll('p');

button.addEventListener('click', function() {
  let sum = 0;
  
  for (let elem of elems) {
    sum += Number(elem.textContent);
  }
  
  console.log(sum);
});
Задание 5

Պարբերության վրա կտտացնելիս նրա վերջում պետք է ավելացվի նշված տեքստը:

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 += '!';
  });
}
Задание 6

Կոճակի վրա կտտացնելիս յուրաքանչյուր պարբերության տեքստը պետք է դառնա թավ:

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.textContent + '</b>';
  }
});
Задание 7

Կոճակի վրա կտտացնելիս կոնսոլում պետք է արտածվի պարբերությունների թվերի գումարը:

html<p>1</p>
<p>2</p>
<p>3</p>

<button>click</button>
javascriptlet button = document.querySelector('button');
let elems  = document.querySelectorAll('p');

button.addEventListener('click', function() {
  let sum = 0;
  for (let elem of elems) {
    sum += Number(elem.textContent);
  }
  console.log(sum);
});
Задание 8

Դաշտերում մուտքագրվում են թվեր: Կոճակի վրա կտտացնելիս կոնսոլում պետք է արտածվի դաշտերի թվերի գումարը՝ դաշտերի թվերի գումարը:

html<input>
<input>
<input>

<button>click</button>
javascriptlet button = document.querySelector('button');
let elems  = document.querySelectorAll('input');

button.addEventListener('click', function() {
  let sum = 0;
  for (let elem of elems) {
    sum += Number(elem.value);
  }
  console.log(sum);
});
Задание 9

Առաջին երկու դաշտերում մուտքագրվում են թվեր: Կոճակի վրա կտտացնելիս երրորդ դաշտում պետք է արտածվի այդ թվերի գումարը:

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.value = Number(inp1.value) + Number(inp2.value);
});
Задание 10

Առաջին երկու դաշտերում մուտքագրվում են թվեր: Կոճակի վրա կտտացնելիս պարբերությունում պետք է արտածվի այդ թվերի գումարը:

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');

btn.addEventListener('click', function() {
  res.textContent = Number(inp1.value) + Number(inp2.value);
});
Задание 11

Կոճակի վրա կտտացնելիս պետք է ստուգել, արդյոք յուրաքանչյուր դաշտի տեքստը համընկնում է նրա data ատրիբուտի տեքստի հետ:

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('#btn')

button.addEventListener('click',function() {
  for (let input of inputs) {
    if (input.value === input.dataset.text) {
      input.classList.add('right')
    } else {
      input.classList.add('wrong')
    }
  }
});
Задание 12

Կոճակի վրա կտտացնելիս պետք է ստուգել, արդյոք յուրաքանչյուր դաշտի տեքստը համընկնում է զանգվածի համապատասխան տարրի տեքստի հետ:

html<input>
<input>
<input>

<button id="btn">click</button>
javascriptlet inputs = document.querySelectorAll('input')
let button = document.querySelector('#btn')

let texts = [
  'text1',
  'text2',
  'text3',
];

button.addEventListener('click',function() {
  for (let i = 0; i < inputs.length; i++) {
    if (inputs[i].value === texts[i]) {
      inputs[i].classList.add('right')
    } else {
      inputs[i].classList.add('wrong')
    }
  }
});
Задание 13

Դաշտերում մուտքագրվում են թվեր: Կոճակի վրա կտտացնելիս կոնսոլում պետք է արտածվի մուտքագրված թվերի գումարը՝ մուտքագրված թվերի գումարը:

html<input>
<input>
<input>

<button id="btn">click</button>
javascriptlet inputs = document.querySelectorAll('input');
let btn = document.querySelector('#btn');

btn.addEventListener('click', function() {
  let sum = 0;
  for (let input of inputs) {
    sum += Number(input.value);
  }
  console.log(sum);
});
Задание 14

Առաջին երկու դաշտերում մուտքագրվում են թվեր: Կոճակի վրա կտտացնելիս երրորդ դաշտում պետք է արտածվի այդ թվերի գումարը:

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() {
  let sum  = Number(inp1.value) + Number(inp2.value);
  inp3.value = sum;
});
Задание 15

Դաշտում մուտքագրվում է թիվ: Ֆոկուսը կորցնելուց կոնսոլում պետք է արտածվի այդ թվի թվանշանների գումարը:

html<input id="inp">
javascriptlet inp = document.querySelector('#inp');

inp.addEventListener('blur', function() {
  let str = this.value;
  let digits = str.split('');
  let sum = 0;
  
  for (let digit of digits) {
    sum += Number(digit);
  }
  
  console.log(sum);
});