دورة javascript للمبتدئين الدرس التاسع عشر


فهاد الجزء التاسع عشر من دورة javascript للمبتدئين غادي نشوفوا des événements لي عندهم علاقة ب DOM منبعد غادي نشوفوا واحد ل حاجة جديدة ولي هي local storage ولي سبق ودرت des projets فيها منقبل ف local storage كتمكن باش ن enregistrer des données ف stockage ديال navigateur. 


1- كيفاش نزيد un événement ل un élément ب javascript

فباش نزيد un événement ل un élément html فكيف شفنا من قبل كنسترجعوه بل id ديالو من بعد كنزيدولو ل méthode  eventListener فالمثال لي عندنا كنسترجع ل h3 بل id ديالو من بعد كنزيدلو ل event click لي كينفد ل fonction launchEvent لي كت afficher texte لي عندي فل h3 الكود لي زدت هو :

                                //index.html

   <h3 id="title">DarijaCoding</h3>

//main.js

const h3 = document.getElementById('title');
h3.addEventListener('click',launchEvent);
function launchEvent(e){
    alert(e.target.textContent);
}
                            

2- كيفاش نزيد معلومة ف local storage

 فكيف قلنا  local storage كتمكن باش ن enregistrer des données ف stockage ديال navigateur فباش نزيد المعلومة عندي ل object localStorage لي بل méthode setItem لي كتاخد ل key ول valeur فالمثال لي عندي كنزيد objet فيه nom كيساوي samadi ويلا كليكيت على F12 ف navigateur ومشيت ل application منبعد Local Storage غادي نلقى ل objet ديالي تزاد الكود لي زدت هو : 

                                //main.js

localStorage.setItem('nom', 'samadi');
                            

3- كيفاش نسترجع معلومة من local storage

فباش نسترجع معلومة من local storage عندي ل méthode getItem ديال ل objet localStorage فالمثال لي عندي كنسترجع nom لي زدنا من بعد كن afficher la valeur ديالو لي هي samadi فميساج الكود لي زدت هو :

                                //main.js

localStorage.setItem('nom', 'samadi');
const nom = localStorage.getItem('nom');
alert(nom);
                            

4- كيفاش نمسح معلومة من local storage

فباش نمسح معلومة من local storage عندي ل méthode removeItem ديال ل objet localStorage لي كتاخد ل key لي غادي يتمسح  فالمثال لي عندي كنمسح nom لي زدنا الكود لي زدت هو :

                                    //main.js

localStorage.setItem('nom', 'samadi');
const nom = localStorage.removeItem('nom');
                                

5- كيفاش نخوي local storage

فباش نمسح كلشي من local storage عندي ل méthode clear ديال ل objet localStorage فالمثال لي عندي كنمسح كلشي باستعمال clear الكود لي زدت هو :

                                    //main.js

localStorage.clear();