როგორ დააკავშიროთ js სკრიპტები html-თან. გარე JavaScript ფაილის დაკავშირება

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

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

რა არის სკრიპტი?

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

სკრიპტები, რომლებზეც ჩვენ ვისაუბრებთ, სპეციფიკურია ვებსაიტისთვის და იყენებენ ენებს, როგორიცაა JavaScript და JQuery. ეს იმიტომ აღვნიშნე, რომ სკრიპტების კონცეფცია საკმაოდ ფართოა და გამოიყენება სხვადასხვა მიმართულებით, ჩვენს შემთხვევაში ეს არის ვებსაიტები.

სკრიპტები HTML-ში.

ჩვენს შემთხვევაში, ჩვენ გამოვიყენებთ ორ HTML ტეგს, რომელიც დაგვეხმარება სკრიპტების დაკავშირებაში.

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

HTML ტეგი განკუთვნილია აცნობოს გვერდის ვიზიტორს, რომ სკრიპტის მხარდაჭერა გამორთულია მის ბრაუზერში ან საერთოდ არ არსებობს. ეს ნიშნავს, რომ ის ვერ შეძლებს იმ გვერდის სრულ ფუნქციონირებას, რომელზეც ის მდებარეობს.

სკრიპტის დაკავშირება. როგორ ჩავსვათ სკრიპტი HTML-ში? (დაკავშირების ყველა ვარიანტი)

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

სკრიპტის დაკავშირება სხვა სერვერიდან.

სკრიპტების გამოყენებისას, ყოველთვის არ გვჭირდება მათი ჩაწერა ან ფაილების ჩამოტვირთვა და მათ სერვერზე განთავსება დასაკავშირებლად. სკრიპტის სკრიპტის ფაილი ასევე შეიძლება განთავსდეს მესამე მხარის სერვერზე, მაგალითად, როგორიცაა google.

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

ასე რომ, დასაკავშირებლად გადადით Google დეველოპერების გვერდზე. თქვენი ძიების გასაადვილებლად, აქ არის ბმული: https://developers.google.com/speed/libraries/devguide#jquery. შემდეგ ჩვენ უბრალოდ ვაკოპირებთ მსგავს კოდს ჩვენს HTML დოკუმენტში:

ბიბლიოთეკის ვერსია შეიძლება განსხვავდებოდეს.

კოდის კოპირების შემდეგ, ჩვენ ჩასვით მას HTML დოკუმენტში დახურვის ტეგამდე. რის შემდეგაც შეგვიძლია შევამოწმოთ ბიბლიოთეკა დაკავშირებულია თუ არა. ნახეთ ვიდეო გაკვეთილი, რომ ნახოთ როგორ გააკეთოთ ეს.

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

სკრიპტის დაკავშირება ჩვენი სერვერიდან.

კავშირის ეს მეთოდი პირველის მსგავსია, მხოლოდ ჩვენი სერვერიდან სკრიპტის დაკავშირებისას, ანუ სკრიპტებით ფაილი უნდა იყოს განთავსებული იმ ჰოსტინგზე, რომელსაც თავად საიტი იყენებს, ჩვენ უნდა მივუთითოთ ფაილის სწორი გზა. ასევე, საიტის ფაილებში ორიენტაციის უფრო მოსახერხებელი ორგანიზებისთვის, შეგვიძლია შევქმნათ ცალკე საქაღალდე სკრიპტებისთვის და დავარქვათ, მაგალითად, js. შემდეგ ამ საქაღალდეში უნდა ჩავსვათ ფაილი .js ფორმატში, რომელიც შეიცავს კავშირისთვის აუცილებელ ფუნქციებს. და მიუთითეთ ამ ფაილის გზა HTML დოკუმენტში დახურვის head tag-მდე.

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

თქვენ შეგიძლიათ ჩამოტვირთოთ სკრიპტის ფაილი ამ გვერდზე ვიდეო კურსის დამატებითი მასალების გვერდზე.

როგორ შევამოწმოთ სკრიპტის მოქმედება ნაჩვენებია ვიდეო კლიპში.

სკრიპტის ჩასმა HTML დოკუმენტში. როგორ ჩავსვათ სკრიპტი HTML-ში?

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

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

$(function() ($("map").maphilight();$("#squidheadlink").mouseover(function(e) ($("#squidhead").mouseover(); )).mouseout( ფუნქცია(ე) ($("#squidhead").mouseout(); )).click(function(e) (e.preventDefault(); ));

რის შემდეგაც ის უნდა იყოს ჩასმული ტეგებს შორის. ანუ, ჩვენ შეგვიძლია დავამატოთ რამდენიმე ინდივიდუალური ფუნქცია პირდაპირ HTML დოკუმენტში ტეგის წინ:

აქვე უნდა აღინიშნოს, რომ იმისათვის, რომ გამოსახულების რუკის ხაზგასმა იმუშაოს, თქვენ უნდა დაამატოთ ყველა შემოთავაზებული სკრიპტი. ანუ JQuery ბიბლიოთეკა, დააკავშირეთ ფაილი, რომელიც არის დამატებით მასალებში და დაამატეთ ფუნქცია HTML დოკუმენტში. თუ ერთი ნაბიჯი მაინც არ არის დასრულებული, განათება არ იმუშავებს.

HTML ტეგი.

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

შენი სკრიპტი არ მუშაობს...

ეს ტეგი უნდა იყოს ჩართული გახსნის ტეგის შემდეგ.

ვიდეო გაკვეთილი: სკრიპტების დაკავშირება HTML-ში. ჩართეთ გამოსახულების რუკის უკანა განათება.

HTML დირექტორია და სხვა მასალები შეიძლება და უნდა ჩამოიტვირთოს!

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

ბოლო განახლება: 11/1/2015

JavaScript კოდის ვებ გვერდზე დასაკავშირებლად კიდევ ერთი გზაა კოდის განთავსება გარე ფაილებში და მათი დაკავშირება ტეგის გამოყენებით.

ასე რომ, ბოლო თემაში შევქმენით html გვერდი index.html, რომელიც მდებარეობს აპლიკაციის დირექტორიაში. ახლა მოდით შევქმნათ ახალი ქვეცნობარი ამ დირექტორიაში. მოდით დავარქვათ js. ის განკუთვნილი იქნება ფაილების შესანახად Javascript კოდით. ამ ქვედირექტორიაში ჩვენ შევქმნით ახალ ტექსტურ ფაილს, რომელსაც დავარქმევთ myscript.js. javascript კოდის მქონე ფაილებს აქვთ .js გაფართოება. ანუ, ჩვენ გვექნება შემდეგი სტრუქტურა აპლიკაციის საქაღალდეში:

მოდით გავხსნათ ფაილი myscript.jsტექსტურ რედაქტორში და განსაზღვრეთ მასში შემდეგი კოდი:

Var date = new Date(); // მიიღეთ მიმდინარე თარიღი var time = date.getHours(); // მიიღეთ მიმდინარე დრო საათებში, თუ (დრო< 13) // сравниваем время с число 13 alert("Доброе утро!"); // если время меньше 13 else alert("Добрый вечер!"); // если время равно 13 и больше

index.html გვერდის დაშიფვრასთან თავსებადობისთვის, ასევე მიზანშეწონილია დააყენოთ კოდირება utf-8-ზე Javascript ფაილისთვის.

აქ უფრო მეტი javascript გამონათქვამებია. პირველი გამოხატულება იღებს მიმდინარე თარიღს და ანიჭებს მას თარიღის ცვლადს. მეორე ინსტრუქციის გამოყენებით ჩვენ ვიღებთ დროს საათებში. შემდეგი, ჩვენ ვადარებთ მიღებულ დროს 13 ნომერს და, ტესტის შედეგებიდან გამომდინარე, ვაჩვენებთ პირველ ან მეორე შეტყობინებას.

ახლა მოდით დავაკავშიროთ ეს ფაილი index.html ვებ გვერდზე:

JavaScript პირველი JavaScript პროგრამა

ვებ გვერდზე javascript კოდით ფაილის ჩასართავად ასევე გამოიყენება ტეგი, რომელსაც აქვს src ატრიბუტების ნაკრები. ეს ატრიბუტი მიუთითებს სკრიპტის ფაილის გზაზე. ჩვენს შემთხვევაში, შედარებითი გზა გამოიყენება. ვინაიდან ვებ გვერდი მდებარეობს იმავე საქაღალდეში, სადაც js დირექტორია, ჩვენ შეგვიძლია ჩავწეროთ როგორც გზა js/myscript.js.

ასევე უნდა გაითვალისწინოთ, რომ გახსნის სკრიპტის ტეგს უნდა მოჰყვეს დახურვის ტეგი.

და index.html ფაილის გახსნის შემდეგ ბრაუზერი აჩვენებს შეტყობინებას:

JavaScript კოდის განსაზღვრისგან განსხვავებით, მის გარე ფაილებში განთავსებას რამდენიმე უპირატესობა აქვს:

ჩვენ შეგვიძლია ხელახლა გამოვიყენოთ ერთი და იგივე კოდი მრავალ ვებ გვერდზე

ბრაუზერს შეუძლია გარე javascript ფაილების ქეშირება, ამის გამო, შემდეგ გვერდზე წვდომისას, ბრაუზერი ამცირებს დატვირთვას სერვერზე და ბრაუზერს სჭირდება ნაკლები ინფორმაციის ჩამოტვირთვა.

ვებ გვერდის კოდი ხდება „უფრო სუფთა“. ის შეიცავს მხოლოდ html მარკირებას და ქცევის კოდი ინახება გარე ფაილებში. შედეგად, თქვენ შეგიძლიათ გამოყოთ HTML გვერდის კოდის შექმნის სამუშაო ჯავასკრიპტის კოდის დაწერისგან

ამიტომ, ზოგადად სასურველია JavaScript კოდის გამოყენება გარე ფაილებში, ვიდრე უშუალოდ ვებ გვერდზე ჩასმა სკრიპტის ელემენტის გამოყენებით.

07/02/17 6.4K

JavaScript არის პროგრამირების ენა, რომელიც გამოიყენება ვებ დეველოპმენტში. იგი გამოიყენება ინტერაქტიული ვებ გვერდებისა და ვებ აპლიკაციების შესაქმნელად. თანამედროვე ბრაუზერები მხარს უჭერენ JavaScript-ს HTML სკრიპტის ტეგის გამოყენებით და არ საჭიროებს დამატებითი დანამატების დაყენებას.

JavaScript უნდა იყოს ჩატვირთული და გაშვებული მარკირების პარალელურად. ეს შეიძლება გაკეთდეს HTML დოკუმენტის შიგნით ან ცალკეულ ფაილში, რომელსაც ბრაუზერი ჩატვირთავს HTML-თან ერთად.

ამ სტატიაში ვისაუბრებთ იმაზე, თუ როგორ დააკავშიროთ JavaScript თქვენს მიერ შექმნილ ვებ გვერდებზე სკრიპტის სახით HTML დოკუმენტში და ცალკე ფაილში.

JavaScript-ის დამატება HTML დოკუმენტში

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

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

მაგრამ თუ თქვენს სკრიპტს სჭირდება გვერდის განლაგების კონკრეტულ ადგილას გაშვება, მაშინ ის მოთავსებულია .

განვიხილოთ შემდეგი HTML დოკუმენტი სათაურით დღევანდელი თარიღი:

index.html

Დღევანდელი თარიღი

ამჟამად ფაილი შეიცავს მარკირებას HTML-ში სკრიპტის ტეგის გარეშე. ვთქვათ, გვინდა მასში დავამატოთ შემდეგი JavaScript კოდი:

მოდით d = new Date(); alert ("დღევანდელი" თარიღი არის " + d);

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

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

index.html

დღევანდელი თარიღი მოდით d = new Date(); alert("დღევანდელი თარიღი არის " + d);

ახლა, როდესაც ატვირთავთ გვერდს HTML სკრიპტით, ნახავთ შეტყობინებას, რომელიც ასე გამოიყურება:

შეგიძლიათ ექსპერიმენტი: ჩადეთ ეს კოდი შიგნით ან, პირიქით, გადაიტანეთ იგი ტეგის გარეთ და გადატვირთეთ გვერდი. ვინაიდან HTML დოკუმენტი საკმაოდ მარტივია, განსხვავებას ვერ შეამჩნევთ.

HTML დოკუმენტის სტრუქტურაში ცვლილებების შესატანად, თქვენ უნდა განათავსოთ კოდი განყოფილების შემდეგ. ახლა თარიღი გამოჩნდება გვერდზე:

index.html

დღევანდელი თარიღი მოდით d = new Date( document.body.innerHTML = "დღევანდელი თარიღი არის " + d + "";

ზემოაღნიშნული HTML დოკუმენტის ბრაუზერში ჩატვირთვისას, ვებ გვერდი სკრიპტის ტექსტით HTML ასე გამოიყურება:

მცირე სკრიპტებს შეუძლიათ კარგად იმუშაონ HTML ფაილში. მაგრამ დიდი სკრიპტებისთვის ეს მიდგომა არაეფექტურია. მათი დანერგვა მარკირებას უხერხულ და რთულად გასაგებს ხდის. შემდეგი, ჩვენ განვიხილავთ, თუ როგორ უნდა შევიტანოთ ცალკე JavaScript ფაილი HTML დოკუმენტში. მუშაობა ცალკე JavaScript ფაილთან

დიდი სკრიპტების დასაყენებლად, რომლებიც გამოყენებული იქნება მრავალ ვებგვერდზე, JavaScript კოდი მოთავსებულია ერთ ან მეტ js ფაილში. ისინი დაკავშირებულია HTML დოკუმენტთან, ისევე როგორც CSS.

ცალკე JavaScript ფაილის გამოყენების უპირატესობები:

• HTML მარკირებისა და JavaScript კოდის გამოყოფა მათ უფრო ადვილად აღსაქმელს ხდის;
• ინდივიდუალური ფაილების შენარჩუნება უფრო ადვილია;
• როდესაც JavaScript ფაილები ინახება, გვერდები უფრო სწრაფად იტვირთება.

JavaScript ფაილის დოკუმენტთან დაკავშირების საჩვენებლად HTML-ში სკრიპტის ტეგის გარეშე, შევქმნათ პატარა ვებ პროექტი. ის შედგება script.js ფაილისგან, რომელიც მდებარეობს js/ დირექტორიაში, style.css ფაილისაგან, რომელიც მდებარეობს css/ დირექტორიაში და index.html მთავარი გვერდისგან, რომელიც მდებარეობს პროექტის root-ში:

შეგიძლიათ დაიწყოთ HTML შაბლონით ზემოთ მოცემული განყოფილებიდან:

index.html

Დღევანდელი თარიღი

ახლა მოდით გადავიტანოთ JavaScript კოდი, რომელიც აჩვენებს თარიღს სათაურის სახით script.js ფაილში:

script.js

მოდით d = new Date(); document.body.innerHTML = "დღევანდელი თარიღი არის " + d + ""

ტეგი მიუთითებს script.js ფაილზე, რომელიც მდებარეობს ვებ პროექტის js/ დირექტორიაში. მოდით შევხედოთ ამ ხაზს ჩვენი HTML ფაილის კონტექსტში, რომელიც მდებარეობს განყოფილებაში:

index.html

Დღევანდელი თარიღი

მოდით დაარედაქტიროთ style.css ფაილი, დავამატოთ ფონის ფერი და სათაურის სტილი.

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

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

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

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

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

სასწავლო პროცესში უამრავ შეცდომას დაუშვებთ, გამოტოვებთ პუნქტუაციის ნიშნებს, რაც თავის მხრივ იწვევს პროგრამას, რომელიც არ მუშაობს. გაკვეთილებზე ვისწავლით ბრაუზერში შეცდომების ინიციალიზაციას, ახალ სიმბოლოებს (), , ; , (), !, ისწავლეთ ახალი სიტყვების აღნიშვნა (var, null, else if), გავაანალიზებთ პუნქტუაციის წესებს და თავად ენის სინტაქსს.

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

რა არის პროგრამა

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

პროგრამირების პროცესის საფუძველი რამდენიმე ეტაპად იყოფა: თქვენ განსაზღვრავთ რისი გაკეთება გსურთ, შემდეგ დაყოფთ დავალებას ეტაპებად, რომელთაგან თითოეული აუცილებელია საბოლოო შედეგის დასასრულებლად.

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

JavaScript-ის დამატება გვერდზე

ბრაუზერებს ესმით HTML და CSS და აქცევენ ამ ენებს ვიზუალურ ინფორმაციად ეკრანზე. ბრაუზერის ფუნქციას, რომელსაც ესმის HTML და CSS, ეწოდება ბრაუზერის ძრავა. ბრაუზერების უმეტესობას აქვს კომპონენტი, რომელსაც ეწოდება JavaScript თარჯიმანი. ეს არის ის ფუნქცია, რომლითაც მას ესმის JS ენა და შეუძლია შეასრულოს დაწერილი პროგრამის კოდის ნაბიჯები.

სკრიპტის ელემენტი გამოიყენება ბრაუზერისთვის, როდესაც JavaScript გამოჩნდება.

ტეგი არის HTML ბრძანება, რომელიც მოქმედებს როგორც გადამრთველი და ეუბნება ბრაუზერს, სად იწყება JavaScript. როდესაც ბრაუზერი მიაღწევს დახურვის ტეგის ბოლოს, მან იცის, რომ მიაღწია პროგრამის დასასრულს და შეუძლია დაუბრუნდეს თავის ნორმალურ ფუნქციებს.

ხშირად შეგიძლიათ ნახოთ სკრიპტის ელემენტის დამატება ვებ გვერდის მთავარ ნაწილზე - სათაურის განყოფილებაში შემდეგნაირად:

JavaScript გაკვეთილები

ამ მაგალითში, გახსნილი HTML კომენტარის ტეგი არის ჩვენი სკრიპტის კოდის დასასრულის ტეგამდე.

ორმაგი წინ დახრილი // უკვე JavaScript-ის კომენტარია, ის აჩვენებს, რომ მის შემდეგ მომავალი მთელი ხაზი არის კომენტარი JavaScript-ის თვალსაზრისით. წაიკითხეთ მეტი JavaScript-ის კომენტარების შესახებ აქ.