HTML Element Selectors In JavaScript | JavaScript Tutorial In Hindi #14

Поділитися
Вставка
  • Опубліковано 11 жов 2024
  • ►JavaScript Tutorial For Beginners In Hindi Playlist - • JavaScript Tutorials I...
    ►Source Code + Other Material - codewithharry....
    This video is a part of my JavaScript In Hindi Course. JavaScript is a high-level, interpreted programming language that conforms to the ECMAScript specification. JavaScript has dynamic typing, prototype-based object-orientation, and first-class functions.
    Alongside HTML and CSS, JavaScript is one of the best and most demanded technologies of the World Wide Web. JavaScript enables interactive web pages and is a crucial part of web applications. The vast majority of sites use it, and major web browsers have a dedicated JavaScript engine in order to execute it.
    As a multi-paradigm language, it supports event-driven, functional, and imperative programming fashion. It has APIs for dealing with text, arrays, regular expressions, and the DOM, but the language itself does not include any I/O, such as networking, storage, or graphics facilities. It relies upon the host machine environment in which it is embedded to provide these features.
    ►Click here to subscribe - / @codewithharry
    Best Hindi Videos For Learning Programming:
    ►Learn Python In One Video - • Learn Python In Hindi ...
    ►Learn JavaScript in One Video - • JavaScript Tutorial
    ►Learn PHP In One Video - • Learn Php In One Video...
    ►Machine Learning Using Python - • Machine Learning Tutor...
    ►Creating & Hosting A Website (Tech Blog) Using Python - • [Hindi] Web Developmen...
    ►Advanced Python Tutorials - • Intermediate/Advanced ...
    ►Object Oriented Programming In Python - • Object Oriented Progra...
    ►Python Data Science and Big Data Tutorials - • Python Data Science an...
    Follow Me On Social Media
    ►Website (created using Flask) - www.codewithha...
    ►Facebook - / codewithharry
    ►Instagram - / codewithharry
    ►Personal Facebook A/c - / geekyharis
    Twitter - / haris_is_here

КОМЕНТАРІ • 191

  • @shresthaa8005
    @shresthaa8005 2 роки тому +17

    I have completed C, Html, CSS, and Js in one video as well. you have cleared all my doubts. Thankyou.

  • @danishrajvala9684
    @danishrajvala9684 3 роки тому +18

    I must say that this JavaScript playlist is the best, we are really lucky that we are having this content for free, and from the great dev like you sir, I have tried many courses and institutes like Aptech but what you are teaching is more advanced and understandable just because of your teaching styles and hard work, I'm thanking you from the bottom of my heart for everything you have given to us, highly grateful to you and I appreciate your efforts, may God always keep you in his shelter where you keep achieving the success and may your good dreams and wishes come true.
    Kinds regards
    Danishraj
    love from Pakistan
    love you : )

  • @rahultirkey7950
    @rahultirkey7950 5 років тому +3

    *Thanks.*
    you cleared my doubts. You deserve more subscribers. Don't stop making tutorials.

  • @mdmatiurrahman7373
    @mdmatiurrahman7373 4 роки тому +3

    best teacher ever.....

  • @rishabhdarji6818
    @rishabhdarji6818 3 роки тому +17

    4:00 if anyone is getting their result as null, just to one simple thing. Cut this from header and past it just above . Your problem will be solved ;). Because when we put in the header the JS code gets loaded pretty quickly it may be not ready at that time, and by keeping it just above the JS code will get pretty much time to get proper load and our problem will get resolved.

  • @ashishkaramchandani4247
    @ashishkaramchandani4247 5 років тому +3

    Best teacher
    Bhai please java ke tutorial le aao
    Like jisko java ke tutorial chahiye

  • @adigul8264
    @adigul8264 4 роки тому +4

    May you live long i love your teaching style. Love you😘😘😘😙😙

  • @sushilprajapati2234
    @sushilprajapati2234 4 роки тому +7

    great explanation of the element selector ....

  • @tushar2627
    @tushar2627 3 роки тому +6

    harry you are really amazing man your teaching style is soo nice thanqq for teaching us :-)

  • @passiveBhai
    @passiveBhai 4 роки тому +3

    for style multiple element at once
    let a;
    a = document.querySelectorAll('.child');
    Array.from(a).forEach(function (element) {
    element.style.backgroundColor = 'black';
    element.style.color = 'white';
    })

    • @X40Gaming
      @X40Gaming 3 роки тому

      Console.log bhul gye 😂😂😂

  • @rajnisaini4195
    @rajnisaini4195 2 роки тому +1

    Thank you so much sir. your videos are really helpful, well explained and understandable .

  • @shresthaa8005
    @shresthaa8005 2 роки тому +2

    harry bhai it would be more better if have practice sheet in the tutorial as well

  • @aaryan9599
    @aaryan9599 2 роки тому

    I am truly saying that you are the best !!!!

  • @manojpatil2457
    @manojpatil2457 3 роки тому +8

    When I select 'div' by queryselector('div') and then style it styles the entire texts in the 'div class =container' and it turns green and not just ' Welcome to code with harry'

    • @FlashGaming2018
      @FlashGaming2018 3 роки тому +12

      That is because if you notice carefully, the html that harry created in the video has one div inside the body which the first div. All the h1 and other contents are inside that div. Now since document.querySelector('div') targets the first div in the document, therefore all other items also turn green because they are all contained inside the first div.
      Hope this helped!
      Happy Coding!

    • @manojpatil2457
      @manojpatil2457 3 роки тому +1

      @@FlashGaming2018
      Thank you yeah I got it after rewatching video ..
      Thanks for your response..

  • @gabbarsingh6562
    @gabbarsingh6562 2 роки тому +2

    For Future Reference:
    let element = document.getElementById("myfirst");
    element.className;
    element.childNodes;
    element.parentNode;
    element.style.color="red";
    element.innerText="Harry is a good boy";
    element.innerHTML="Harry is a good boy";
    let sel = document.querySelector('#myfirst');
    document.querySelector('.child');
    document.querySelector('div');
    let elems = document.getElementsByClassName('child');
    console.log(elems[0].getElementsByClassName('child'));
    getElementsByTagName('div');
    13:35 - converting HTML collection into Array

  • @vinayaksharma-ys3ip
    @vinayaksharma-ys3ip 2 роки тому

    Thank You Harry Bhai!!!

  • @bug244
    @bug244 3 роки тому +1

    Harry is very GOOD boy

  • @arindamdutta7369
    @arindamdutta7369 4 роки тому +3

    sir how to make money step by step after seeing your videos . thoda roadmap dijie Please

  • @alsaqercos9945
    @alsaqercos9945 2 роки тому

    Great hai Sir

  • @prashantchauhan2426
    @prashantchauhan2426 3 роки тому +1

    thank you sir... love uh..

  • @prayagbhimani3474
    @prayagbhimani3474 3 роки тому +1

    Really you made it easy man !

  • @moviehook9981
    @moviehook9981 Рік тому

    Thanx Harry

  • @pranjalgupta9427
    @pranjalgupta9427 3 роки тому +1

    Thanks, bro..

  • @amjadhussain3258
    @amjadhussain3258 2 роки тому +1

    just masterpiece

  • @asadstech4879
    @asadstech4879 3 роки тому

    hatts off harry bhai..... keepit up
    love from pakistan

  • @ayazaamur
    @ayazaamur 3 роки тому

    You are the best teacher
    Harry Sir

  • @megawatt6699
    @megawatt6699 4 роки тому +1

    you are great bro

  • @anuragsharma3256
    @anuragsharma3256 3 роки тому

    Excellent explanation, big fan!!

  • @MIdWay1
    @MIdWay1 3 роки тому +1

    Thanks sir

  • @msbasera
    @msbasera 2 роки тому

    Thank you bhai ❤️

  • @debjitpal9598
    @debjitpal9598 2 роки тому +1

    In the line number 23 --- "When you enter sel.style.color ='green' " not only heading is green childs are also green but why ? as we are reading single line selector

  • @sumansaha9824
    @sumansaha9824 5 років тому +1

    Harry Bro please python Django API's ke uppar video series banao please and thanks for this wonderful tutorials.....
    Ho sake to please reply karna ....

  • @natural_world_creation6982
    @natural_world_creation6982 2 роки тому

    Very helpful video 👍

  • @parthapaul4306
    @parthapaul4306 3 роки тому +2

    we can use loops to print the elements

  • @alekhbhainsa4690
    @alekhbhainsa4690 3 роки тому

    Very interesting video...thanks Harry Bhai

  • @ziyakhan4672
    @ziyakhan4672 3 роки тому

    keep selected dependent dropdown by database after submit

  • @Karthik-kt24
    @Karthik-kt24 3 роки тому

    Thank you very much bhai

  • @maheshsonsale1241
    @maheshsonsale1241 4 роки тому +7

    Uncaught TypeError: Cannot read property 'style' of undefined

    • @time-is-dead
      @time-is-dead 3 роки тому +2

      Bro use ` this symbol and work only on div

    • @AnitaGupta-zs2el
      @AnitaGupta-zs2el 3 роки тому +1

      Can uh plz explain properly its still showing uncaught error

    • @ShubhamKumar-og5tm
      @ShubhamKumar-og5tm 3 роки тому

      cut the script tag and paste it just above the closing body tag. It will work

  • @SuryanshSingh-f8d
    @SuryanshSingh-f8d 5 років тому +2

    Luv uh bruh😘😍

  • @tech_with_rahul
    @tech_with_rahul 3 роки тому

    thank you brother

  • @rishabhjain911
    @rishabhjain911 2 роки тому

    thankuu. Meoww

  • @ruchiray8557
    @ruchiray8557 3 роки тому

    Amazing explanation

  • @mohdamir3767
    @mohdamir3767 2 роки тому

    Array.from(document.body.getElementsByTagName("p")).forEach(function(ele){console.log(ele.innerText)})

  • @satishbaghel7678
    @satishbaghel7678 4 роки тому +1

    Sir please node is ke bhi tutorial banaiye please

  • @engineerbhai7642
    @engineerbhai7642 5 років тому

    Excellent video

  • @sagarhaldar7559
    @sagarhaldar7559 4 роки тому

    Thank you 💝

  • @shubhamjain164
    @shubhamjain164 2 роки тому

    What is the difference between document.getElementById and document.write
    I am having different outputs when using this on loops

  • @shubhamsharma-ro2gr
    @shubhamsharma-ro2gr 4 роки тому

    Awesome video

  • @JustForProgrammers
    @JustForProgrammers 4 роки тому

    Best Bro

  • @rajbannasa7662
    @rajbannasa7662 3 роки тому

    thank you so much sir

  • @hemantagrahari4298
    @hemantagrahari4298 4 роки тому

    Useful lecture

  • @gaurabgogoi2848
    @gaurabgogoi2848 2 роки тому

    need help,
    I am creating a table, I want to show the table, and from each row, there will be a edit button, so how to use that edit button in each row, for different person's data.
    how to do undefined table's getElement, I mean please help

  • @supriyakore2379
    @supriyakore2379 2 роки тому

    *Thanks *

  • @shahmirnazir1902
    @shahmirnazir1902 4 роки тому +2

    Sir koe website bta dein jahan sy humein sare properties mil jaen you told in this video.

  • @creationofislam
    @creationofislam 5 років тому

    Please make a video about bash ...sehll language

  • @__BrijeshPatel
    @__BrijeshPatel 2 роки тому

    hi harrybhai
    Uncaught TypeError: Cannot read properties of null (reading 'style')

  • @ishtiaqahmad4118
    @ishtiaqahmad4118 4 роки тому

    Good explained I.A.Siddiqui Karachi

  • @RoshanKumar-xs9yx
    @RoshanKumar-xs9yx 5 років тому

    Tq sir...

  • @princesukhala7106
    @princesukhala7106 2 роки тому

    Done done again

  • @devashishnigam5971
    @devashishnigam5971 3 роки тому

    What is the difference between parentElement and parentNode?
    console.log(document.getElementById("child1").parentNode, "parent node");
    console.log(document.getElementById("child1").parentElement, "parent element");

  • @ajazamin9843
    @ajazamin9843 2 роки тому

    05:16 sir why you had same div with two ids first id = 'myfirst' and then id = 'first' its confusing.

  • @jassrajput890
    @jassrajput890 3 роки тому

    now getting interested

  • @apurvesrivastava5597
    @apurvesrivastava5597 2 роки тому

    document.querySelector('.someid') giving me null in console but if i am using class name after dot it is giving me that element in console and getting same result with #someClsName

  • @Jadon09
    @Jadon09 5 років тому

    Nice video

  • @sahinurislam7247
    @sahinurislam7247 3 роки тому

    nice

  • @nidhi8775
    @nidhi8775 Рік тому

    Failed to load resource: the server responded with a status of 404 (Not Found)
    pls help me with this error i have my files connected properly.

  • @uttamsharma1859
    @uttamsharma1859 2 роки тому

    Sir when i use let it gives unexpected identifier error and when i use const it doesn't give ??

  • @saadzafar2390
    @saadzafar2390 3 роки тому

    I have only one script tag in my html file. But document.scripts is consoling that I have 2 scripts ? Why ?

  • @manantyagi6905
    @manantyagi6905 3 роки тому

    love to learn

  • @rohanthapa5790
    @rohanthapa5790 2 роки тому

    document.querySelectorAll(); yeeh wala bhi toha hae nah ??

  • @atharvthombare2963
    @atharvthombare2963 3 роки тому +1

    Harry bhai getelementbyid ki output null aa raha hai
    Plz solution 🙏🙏
    Btw video is fantastic

    • @prakharrana8384
      @prakharrana8384 2 роки тому

      script ko head m add maat kro body m kro nhi ayega null

  • @kushjaiswal9364
    @kushjaiswal9364 5 років тому

    Sir plz make c++

  • @surajpatil3247
    @surajpatil3247 3 роки тому

    let element = document .getElementById("myfirst");
    ->>> it returning null value. why?

    • @akash-lz2dq
      @akash-lz2dq 3 роки тому

      mila bhai solution ?? mera bhi yhi aaa rha hai

  • @rimeshsapkota7335
    @rimeshsapkota7335 3 роки тому

    let element =document.getElementById("print").innerText="Email format is matched";
    element.style.color="pink";
    css is not working why???color of text is no changed when i used above code

  • @Babarkhan-qo1jx
    @Babarkhan-qo1jx 2 роки тому

    any one can explain me why we use JavaScript to change things in our css? we can change it directly from our css?? why we use this selector to change our css??

  • @taranjeetsingh3629
    @taranjeetsingh3629 3 роки тому

    Sir what do u mean from access the playlist?

  • @maheshsonsale1241
    @maheshsonsale1241 4 роки тому +1

    Uncaught TypeError: Cannot read property 'style' of undefined
    please tell about this

    • @enthoharsh7403
      @enthoharsh7403 4 роки тому +1

      same problem with me !

    • @ujjwalkumar9216
      @ujjwalkumar9216 4 роки тому +2

      Use window.onload= function() {
      Your code
      }
      This will solve your problem. It was happening with me too.

    • @pawankohad6702
      @pawankohad6702 3 роки тому

      put , before tag

  • @muhammadhamza1073
    @muhammadhamza1073 4 роки тому +1

    sir g yha tak ham chezen dakhi but ye smjh nai arha k ye web main inak kia use ha

  • @countryball-orgn.
    @countryball-orgn. 6 місяців тому

    How to use childnodes

  • @ShivaSingh-gg1yx
    @ShivaSingh-gg1yx 2 роки тому

    i am not getting output in console after writing
    let element = document.getElementById('myfirst');
    console.log(element);
    O/p in console is 'null'
    why is this happening?
    if you know please let me know

    • @ShivaSingh-gg1yx
      @ShivaSingh-gg1yx 2 роки тому

      yes i have already created 'myfirst' id in html file

    • @xcr6436
      @xcr6436 2 роки тому

      Use myFirst instead of myfirst.

  • @mayurikale5134
    @mayurikale5134 2 роки тому

    I would like to see you on Sundeep maheshwari stage..

  • @darshkarmarkar540
    @darshkarmarkar540 4 роки тому

    Hiii sirr I am getting this error while running the javascript code in the console
    Tut16.js:41 Uncaught TypeError: Cannot read property 'getElementsByClassName' of undefined
    at Tut16.js:41

  • @VikasKumar-fw2fo
    @VikasKumar-fw2fo 2 роки тому

    Sir mere laptop may query. Selector nahi chll raha baar baar error show krr raha hai can you tell me about problem of solution

  • @amolchopade7649
    @amolchopade7649 2 роки тому

    Why i get this error [HTTP/1.1 404 Not Found 0ms]??

  • @lovelife-xm2xj
    @lovelife-xm2xj 2 роки тому

    How to change inner html content dynamicaly

  • @dilipsunar99
    @dilipsunar99 4 роки тому +1

    Why is mine showing undefined in the console .. please reply

    • @sagarhaldar7559
      @sagarhaldar7559 4 роки тому

      show me the code

    • @dilipsunar99
      @dilipsunar99 4 роки тому +1

      @@sagarhaldar7559 done bhai 😊 but I need to using the console itself and not the text editor 😊Thanks for the concern

  • @ashishsahuT
    @ashishsahuT 3 роки тому

    👌👌

  • @muhammadsheryar9329
    @muhammadsheryar9329 3 роки тому +1

    where can i find practice questions?

  • @RohanDasRD
    @RohanDasRD 5 років тому +2

    Jo bhi bolo Bhai thumbnail har series ka mast banate hi

  • @milanbehera509
    @milanbehera509 4 роки тому +1

    bhai...jab v mein document.getelementbyId(myfirst); likhta hun tab console mein *null* show kyun kqr raha h?

    • @nishantprajapati9974
      @nishantprajapati9974 4 роки тому

      myfirst ko quotes m likho

    • @godupliftsyou5426
      @godupliftsyou5426 4 роки тому +3

      Sometimes application need some time interval to load webpage,
      Please follow below code,
      setTimeout(function(){
      let element = document.getElementById('myfirst');
      console.log(element);
      }, 2000);
      Hope it should work for all !!

    • @sohilpathan7168
      @sohilpathan7168 4 роки тому +1

      @@godupliftsyou5426 it worked bro thank you so much!!!

    • @jaydesai1176
      @jaydesai1176 2 роки тому +1

      @@godupliftsyou5426 But Why Bro ? Why we can not use only document.getElementById('something');

  • @saulgoodman9405
    @saulgoodman9405 2 роки тому +1

    as a non css user, it was really hard to understand this tutorial.

  • @nishantprajapati9974
    @nishantprajapati9974 4 роки тому +1

    harry bhai itni language ati h apko or apse syntex bhi mix nhi hote kyu?

  • @sohilpathan7168
    @sohilpathan7168 4 роки тому

    sir whenever i am typing let element = document.getElementById("myfirst"); it showing null in console why????

    • @jenilgandhi9941
      @jenilgandhi9941 4 роки тому

      koi problem hoga typing me
      id me myfirst ka synatx check kar lo

    • @soumitrosaha8793
      @soumitrosaha8793 4 роки тому

      I also faced the same problem and could not get what is the problem is. And I’m gonna make sure that there were no typing or syntax errors but the problem is not fixed. Does anyone have any suggestions regarding THIS issue?

    • @desmondmiles8474
      @desmondmiles8474 4 роки тому

      "myfirst" ko "myFirst" try...reply if it solves the problem...
      let element = document.getElementById("myFirst");

    • @sagarhaldar7559
      @sagarhaldar7559 4 роки тому

      console.log(element);
      ye karlo , fir ayega sab kuch..

    • @pawankohad6702
      @pawankohad6702 3 роки тому +2

      put , before tag

  • @karanval5268
    @karanval5268 3 роки тому

    Sorry, I forgot, what was foreach?

  • @artistnahiart3728
    @artistnahiart3728 4 роки тому +1

    solution vdo kahan hai?

  • @anjalimoon619
    @anjalimoon619 3 роки тому

    sel= document.querySelector('div');
    sel.style.color= 'cyan';
    console.log(sel);
    aisa krne pe mere baki div ke v color change ho rhe hain.

    • @anjalimoon619
      @anjalimoon619 3 роки тому +1

      sir please meko thoda clear kre qki jb aap v kr rhe ho toh usme v baki div ke v color change ho rhe hain .

    • @mihirkumarsrivastava9389
      @mihirkumarsrivastava9389 3 роки тому

      @@anjalimoon619 exactly same question here, did you get the answer please reply.

    • @bhavingadhiya3844
      @bhavingadhiya3844 3 роки тому

      All turns green

    • @Sanjeev8880
      @Sanjeev8880 3 роки тому

      @@bhavingadhiya3844 becoz all the div is inside the

    • @Sanjeev8880
      @Sanjeev8880 3 роки тому +1

      @@anjalimoon619 becoz all the div is inside the

  • @life2hell7503
    @life2hell7503 5 років тому

    Sir xampp use nhi ho pa rha h uski vjah se mai aage Ka kaam nhi kr pa rha hu kya kru

  • @achainsanei4714
    @achainsanei4714 5 років тому

    bhai me ne ap ke video Facebook whatpp pe shere kar diya

  • @schoollifeenjoys2131
    @schoollifeenjoys2131 5 років тому

    👍👍👍

  • @rajalgi6039
    @rajalgi6039 3 роки тому

    Bhaii live server nahi chal Raha hai .js file mein