DOM ile JavaScript Kodunda Hata Arama

Задание 1

Kod, her paragrafın sonuna metin eklemelidir:

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

javascriptlet elems = document.querySelectorAll('p');
for (let elem of elems) {
  elem.textContent += '!';
}

Задание 2

Bir paragrafa tıklandığında, değeri bir artırılmalıdır:

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

Butona tıklandığında, paragrafın metni kalın yapılmalıdır:

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

Butona tıklandığında, paragraflardaki sayıların toplamı yazdırılmalıdır:

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

Bir paragrafa tıklandığında, sonuna belirtilen metin eklenmelidir:

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

Butona tıklandığında, her paragrafın metni kalın yapılmalıdır:

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

Butona tıklandığında, konsola paragraflardaki sayıların toplamı yazdırılmalıdır:

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

Input alanlarına sayılar girilir. Butona tıklandığında, konsola inputlardaki sayıların toplamı yazdırılmalıdır:

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

İlk iki inputa sayılar girilir. Butona tıklandığında, üçüncü inputa bu sayıların toplamı yazdırılmalıdır:

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

İlk iki inputa sayılar girilir. Butona tıklandığında, paragrafa bu sayıların toplamı yazdırılmalıdır:

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

Butona tıklandığında, her inputtaki metnin kendi data özniteliğindeki metinle eşleşip eşleşmediği kontrol edilmelidir:

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

Butona tıklandığında, her inputtaki metnin dizideki karşılık gelen elemanla eşleşip eşleşmediği kontrol edilmelidir:

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

Input alanlarına sayılar girilir. Butona tıklandığında, konsola girilen sayıların toplamı yazdırılmalıdır:

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

İlk iki inputa sayılar girilir. Butona tıklandığında, üçüncü inputa bu sayıların toplamı yazdırılmalıdır:

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

Input alanına bir sayı girilir. Odak kaybedildiğinde, konsola bu sayının basamakları toplamı yazdırılmalıdır:

html<input id="inp">

javascriptlet inp = document.querySelector('#inp');

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