ძირითადი მასალა

კომპიუტერული პროგრამირება

კურსი: კომპიუტერული პროგრამირება > თემა 7

გაკვეთილი 2: DOM-ის წვდომა jQuery-ს საშუალებით

შეფასება: DOM-ზე წვდომა jQuery-ის დახმარებით

jQuery-ის საშუალებით DOM ელემენტის საპოვნელად გადაეცით სწორი CSS სელექტორი jQuery-ის ფუნქციას:

$("h1"); // ირჩევს ყველა h1-ს
$("#heading"); // ირჩევს ელემენტს, რომლის id-ია "heading"
$(".warning"); // ირჩევს ყველა ელემენტს, რომლის კლასის სახელია "warning"

გაითვალისწინეთ, რომ jQuery ფუნქციას შეიძლება, ერქვას $ ან jQuery - ეს იგივეა, რაც:

jQuery("h1");  
jQuery("#heading");  
jQuery(".warning");

ბევრს ურჩევნია $, რადგან ის ძალიან მოკლეა.

jQuery ფუნქცია ყოველთვის აბრუნებს შესაბამისი ელემენტების jQuery კოლექციას, მაშინაც კი, როცა არსებობს ერთი ან არცერთი შესაბამისი ელემენტი! jQuery ფუნქციის შესახებ მეტის წაკითხვა შეგიძლიათ მის დოკუმენტაციაში.

როდესაც იპოვით DOM-ის ელემენტებს jQuery-ის საშუალებით, შეძლებთ ისეთი რაღაცების კეთებას, როგორიცაა მათი შიგთავსის ცვლილება text() თვისების გამოყენებით: $("#temperature").text("89° ფარენჰაიტით"); (იხილეთ სრული მაგალითი)

თქვენ შეგიძლიათ, გამოიყენოთ იგივე მეთოდი text(), რათა მიიღოთ შიგთავსი პარამეტრების გადაცემის გარეშე:
var heading = $("#heading").text();

შემდეგ სახელმძღვანელოში თქვენ ისწავლით მრავალ ახალი მეთოდს DOM ელემენტების თვისებების მისაღებად და განსასაზღვრად.

კულისების მიღმა, ყველა ეს jQuery ფუნქცია იყენებს DOM API-ს, რომელიც შეგასწავლეთ HTML/JS კურსში. მაგალითად, $ ფუნქცია იყენებს ისეთ მეთოდებს, როგორებიცაა getElementById(),querySelectorAll() და attr(), რომელიც იყენებს getAttribute() მეთოდს. როდესაც წერთ$ ფუნქციას, თქვენ ისევ იყენებთ ამ ფუნქციებს, თუმცა კოდის ნაკლები რაოდენობის დაწერით და ასევე აცნობიერებთ იმას, რომ თქვენი კოდი იმუშავებს jQuery-ის მხარდაჭერის მქონე ყველა ბრაუზერში, რაც განსაკუთრებით მნიშვნელოვანია უახლესი DOM API ფუნქციების გამოყენებისას.

გსურთ, შეუერთდეთ დისკუსიას?

შესვლა

დავალაგოთ:

პოსტები ჯერ არ არის.

გესმით ინგლისური? დააწკაპუნეთ აქ და გაეცანით განხილვას ხანის აკადემიის ინგლისურენოვან გვერდზე.