ელემენტის ტექსტის შეცვლა jQuery-ით
წინა გაკვეთილებში ჩვენ ვისწავლეთ როგორ მივიღოთ
ელემენტების ჯგუფი jQuery-ის მეშვეობით და თუნდაც ვნახეთ
მეთოდებთან მუშაობის რამდენიმე მაგალითი. ახლა
უფრო დეტალურად განვიხილოთ ისინი. ამ გაკვეთილში
ჩვენ ვისწავლით როგორ შევცვალოთ ელემენტის ტექსტი ორი
მეთოდის გამოყენებით: html და
text.
მოვაგვაროთ შემდეგი ამოცანა: მივიღოთ ყველა ელემენტი
კლასით www და ერთდროულად შევცვალოთ
მათი ტექსტი '!!!'-ზე. დავუშვათ, რომ გვაქვს
შემდეგი HTML კოდი:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
მაშინ JavaScript კოდი ასე გამოიყურება:
let elems = document.getElementsByClassName('www');
for (let i = 0; i < elems.length; i++) {
elems[i].innerHTML = '!!!';
}
jQuery-ით ყველაფერი ბევრად უფრო მარტივი იქნება: მივიღოთ
ყველა ელემენტი დოლარის გამოყენებით, ასე:
$('.www'), და შემდეგ გამოვიყენოთ მათზე მეთოდი
html,
რომელიც პარამეტრად იღებს ახალ
ტექსტს - $('.www').html('new text'). სრულიად! ეს
სტრიქონი შეასრულებს მთელ სამუშაოს ყოველგვარი ციკლების და
სხვა არაფრის გარეშე. გაუშვით მაგალითი და თავად შეამოწმეთ:
$('.www').html('!!!');
ყველა h3 ელემენტს მეთოდის html გამოყენებით
დააყენეთ ტექსტი '!!!'.