ტექსტური ველების მუშაობა JavaScript-ში

ახლა ჩვენ ვისწავლით როგორ მივიღოთ ტექსტი ჩვენი საიტის მომხმარებლებისგან. ამისთვის HTML-ში გათვალისწინებულია სპეციალური ტეგი input, რომელიც წარმოადგენს ტექსტურ ველს მონაცემების შესაყვანად.

<input>

ამ ტეგს აქვს სპეციალური ატრიბუტი value, რომელიც ადგენს საწყის ტექსტს, რომელიც იქნება ჩაწერილი ინპუტში გვერდზე შესვლისას:

<input value="text">

ჩვენი საიტის მომხმარებელს შეუძლია გვერდზე შესვლის შემდეგ შეცვალოს ინპუტის ტექსტი. ამ შემთხვევაში, თუ ჩვენ გვაქვს ცვლადი, რომელიც შეიცავს ამ ინპუტის ბმულს, მაშინ ამ ცვლადის value თვისება ყოველთვის შეიცავს ინპუტის ტექსტის მიმდინარე მნიშვნელობას.

შევეცადოთ პრაქტიკაში. დავუშვათ, ჩვენ გვაქვს ინპუტი value ატრიბუტით:

<input id="elem" value="text">

მოდით მივიღოთ ამ ინპუტის ბმული ცვლადში:

let elem = document.querySelector('#elem');

ახლა კი გამოვიტანოთ ეკრანზე ინპუტის მიმდინარე ტექსტი:

console.log(elem.value);

ახლა კი შევცვალოთ ინპუტის ტექსტი სხვაზე:

elem.value = 'new text';

მოცემულია ინპუტი და ღილაკი. ღილაკზე დაჭერისას ჩაწერეთ ინპუტში რაიმე ტექსტი.

მოცემულია ინპუტი, აბზაცი და ღილაკი. ღილაკზე დაჭერისას ჩაწერეთ აბზაცში ინპუტიდან აღებული ტექსტი.

მოცემულია ორი ინპუტი და ღილაკი. პირველ ინპუტში მომხმარებელს შეყავს რიცხვი. ღილაკზე დაჭერისას ჩაწერეთ მეორე ინპუტში შეყვანილი რიცხვის კვადრატი.

მოცემულია ორი ინპუტი და ღილაკი. ღილაკზე დაჭერისას ჩაწერეთ პირველ ინპუტში მეორე ინპუტის მნიშვნელობა, ხოლო მეორე ინპუტში - პირველის მნიშვნელობა. თქვენმა კოდმა უნდა იმუშაოს უნივერსალურად, ინპუტების ნებისმიერი მნიშვნელობისთვის.

მოცემულია 5 ინპუტი, აბზაცი და ღილაკი. ინპუტში შეყავთ რიცხვები. ღილაკზე დაჭერისას ჩაწერეთ აბზაცში შეყვანილი რიცხვების საშუალო არითმეტიკული.