• Tuesday , 31 March 2020

Understanding DOM & Creating a Website Layout | JavaScript Tutorial In Hindi #12

Code Canyon



►JavaScript Tutorial For Beginners In Hindi Playlist – https://www.youtube.com/playlist?list=PLu0W_9lII9ajyk081To1Cbt2eI5913SsL
►Source Code + Other Material – https://codewithharry.com/videos/javascript-tutorials-in-hindi-12
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 – https://www.youtube.com/channel/UCeVMnSShP_Iviwkknt83cww

Best Hindi Videos For Learning Programming:

►Learn Python In One Video – https://www.youtube.com/watch?v=qHJjMvHLJdg

►Learn JavaScript in One Video – https://www.youtube.com/watch?v=onbBV0uFVpo

►Learn PHP In One Video – https://www.youtube.com/watch?v=xW7ro3lwaCI

►Machine Learning Using Python – https://www.youtube.com/playlist?list=PLu0W_9lII9ai6fAMHp-acBmJONT7Y4BSG

►Creating & Hosting A Website (Tech Blog) Using Python – https://www.youtube.com/playlist?list=PLu0W_9lII9agAiWp6Y41ueUKx1VcTRxmf

►Advanced Python Tutorials – https://www.youtube.com/playlist?list=PLu0W_9lII9aiJWQ7VhY712fuimEpQZYp4

►Object Oriented Programming In Python – https://www.youtube.com/playlist?list=PLu0W_9lII9ahfRrhFcoB-4lpp9YaBmdCP

►Python Data Science and Big Data Tutorials – https://www.youtube.com/playlist?list=PLu0W_9lII9agK8pojo23OHiNz3Jm6VQCH

Follow Me On Social Media
►Website (created using Flask) – https://www.codewithharry.com
►Facebook – https://www.facebook.com/CodeWithHarry
►Instagram (Guaranteed Replies :)) – https://www.instagram.com/haris_magical/
►Personal Facebook A/c – https://www.facebook.com/geekyharis
Twitter – https://twitter.com/Haris_Is_Here

Original source

3d Ocean

Related Posts

31 Comments

  1. rishi jha
    March 25, 2020 at 19:02

    a= document.images
    b= document.links
    console.log(a)
    console.log(b)
    in index.html
    <script>
    document.write(Array.from(a))
    document.write(Array.from(b))
    </script>

  2. Ashvini Hyalij
    March 25, 2020 at 19:02

    Exercise1 solution:
    let l = document.links;

    Array.from(l).forEach(function(element){

    let myLink = element.href;

    let str_pos = myLink.indexOf("python");

    if (str_pos > -1) {

    console.log(myLink);

    }

    });

  3. mohd ausaf Ahmad
    March 25, 2020 at 19:02

    harry bhai tut12.js nhi execute ho raha hai GET http://127.0.0.1:5500/js/js/tut12.js net::ERR_ABORTED 404 (Not Found) ye error a rha hai

  4. Rabbi Ahamed
    March 25, 2020 at 19:02

    let a = document.images;

    Array.from(a).forEach(function(element){

    console.log(element);

    });

    let b = document.scripts;

    Array.from(b).forEach(function(element){

    console.log(element);

    });

  5. Box play PUBG mobile
    March 25, 2020 at 19:02

    Thank you sir,do you like to make a video on div class

  6. YUDHWEER SINGH
    March 25, 2020 at 19:02

    let imgs = document.images;

    Array.from(imgs).forEach(function(element) {

    console.log(element);

    })

    let scriptz = document.scripts;

    for (let index = 0; index < scriptza.length; index++) {

    console.log(scriptz[index]);

    }

  7. Ranjit Panda
    March 25, 2020 at 19:02

    let images=document.images;
    let scripts=document.scripts;
    images.forEach(function img(elements){
    document.getElementById("changeToImage").innerHTML=elements;
    document.getElementById("changeToScript").innerHTML=scripts;
    })

  8. jr.vijaxx
    March 25, 2020 at 19:02

    let val = document.images;
    let val = document.scripts;

  9. Easy Learning
    March 25, 2020 at 19:02

    // Html Code
    <img src="maxresdefault.jpg" alt="" srcset="">

    <img src="maxresdefault (1).jpg" alt="" srcset="">

    <a href="//http://www.youtube.com/channel/UCQuVB20AKCY27p99yc_Xyug?view_as=subscriber">Go To Easy Learning</a>

    //Javascript code

    a = document.images[1];

    a = document.scripts[1].src;

    a = document.scripts[1];

  10. Abhishek Pratap singh
    March 25, 2020 at 19:02

    JS file code
    function prin(item)

    {

    Array.from(item).forEach(i=>{

    console.log(i);

    })

    };

    let a=document.images;

    prin(a);

    a=document.scripts;

    prin(a);

    HTML file code
    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Tutorial on Js</title>

    </head>

    <body>

    <h6> Js tutorial </h6>

    <img src="coffe.jpeg">

    <img src="Green-Leaves.png">

    <img src="coffe.jpeg">

    <img src="Green-Leaves.png">

    <img src="coffe.jpeg">

    <img src="Green-Leaves.png">

    </body>

    <script src="tut2.js"></script>

    </html>

  11. kalyani chute
    March 25, 2020 at 19:02

    good

  12. Prince Kumar Jaiswal
    March 25, 2020 at 19:02

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Quise by Code with Harry</title>
    </head>
    <style>
    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    background: #666;
    }
    .container {
    display: flex;
    justify-content: center;
    align-items: center;
    }
    .child {
    width: 250px;
    height: 250px;
    }
    img {
    width: 100%;
    padding-left: 8px;
    }
    a {
    text-decoration: none;
    color: #fff;
    }
    a:hover {
    color: black;
    }

    h1,p {
    text-align: center;
    }
    p {
    padding-top: 20px;
    }

    </style>
    <body>
    <h1 id="heading">This is the Quise that I have to solve</h1>
    <div class="container">
    <div class="child">Image 1
    <img src="img/image-name1" alt="This is Image">
    <p><a href="code with this dude">If you want to talk with him just click on Link</a></p>
    </div>
    <div class="child">Image 2
    <img src="img/image-name1" alt="This is Image">
    <p><a href="code with this dude">If you want to talk with him just click on Link</a></p>
    </div>
    <div class="child">Image 3
    <img src="img/image-name1" alt="This is Image">
    <p><a href="code with this dude">f you want to talk with him just click on Link</a></p>
    </div>
    <div class="child">Image 4
    <img src="img/image-name1" alt="This is Image">
    <p><a href="code with this dude">If you want to talk with him just click on Link</a></p>
    </div>

    </div>
    </body>
    <script src="web.js" type="text/Javascript"></script>

    </html>

    js code:

    console.log('We are in Web.html page');

    let a = document.all;
    // a = document.links[3];
    // Array.from(a).forEach((element, index) => {
    // console.log(element, index);
    // });

    // a = document.links;
    // Array.from(a).forEach((element, index) => {
    // console.log(element, index);
    // });
    a = document.scripts;
    console.log(a);

  13. zillastate
    March 25, 2020 at 19:02

    // use document.images and document.scripts and print the list of images and scripts on an html page
    let imgStr = `<h1>Images Found</h1>`;
    for (let i = 0; i < document.images.length; i++) {
    imgStr = imgStr.concat(`<img src="${document.images[i].src}" alt="${document.images[i].alt}" width="320px" height="320px"/>`);
    };
    imgStr = imgStr.concat(`<h1>Scripts Found</h1>`);
    for (let j = 0; j < document.scripts.length; j++) {
    imgStr = imgStr.concat(`${j+1}. scripts src="${document.scripts[j].src}" <br>`);
    };
    document.body.innerHTML = imgStr;

  14. Hat Boy
    March 25, 2020 at 19:02

    We should write image tag in html code as- <img src="image.jpg" style=" height: 0px; width:0px ;etc. ">
    We can also declare img src path.
    after that in js file we should write

    let a=document.images;
    After that implement we can get all images and console will show the "HTMLCollection[img]

    now we should write scripts tag

    Let a=document.scripts
    result will be HTMLCollection[scripts, scripts]
    And it was easy
    thanks a lot #codewithharry

  15. RanaBest
    March 25, 2020 at 19:02

    Bhai Code ko zoom thora kr dia kren

  16. Abhishek Gupta
    March 25, 2020 at 19:02

    ript, script, script, script.js-httpswwwyoutubecomytsjsbinwebanimationsnextliteminvflluX5aWwebanimationsnextliteminjs, script.js-httpswwwyoutubecomytsjsbincustomelementses5adaptervflsrwHZHcustomelementses5adapterjs, script.js-httpswwwyoutubecomytsjsbinwebcomponentssdvflPSjQ3Lwebcomponentssdjs, script, script, script, script.js-httpswwwyoutubecomytsjsbinschedulervfl0nTPXRschedulerjs, script.js-httpswwwyoutubecomytsjsbinwwwtamperingvflHhBVPuwwwtamperingjs, script.js-httpswwwyoutubecomytsjsbinwwwprepopulatorvfl8hLntFwwwprepopulatorjs, script.js-httpswwwyoutubecomytsjsbinspfvflqCgDoFspfjs, script.js-httpswwwyoutubecomytsjsbinnetworkvfl3EpVxjnetworkjs, script, script, script.js-chromeextensionpkedcjkdefgpdelpbcmbmeomcjbeemfmcast_senderjs, script, script, script, script, script, script, script, script, script.js-httpswwwyoutubecomytsjsbindesktop_polymer_sel_auto_svg_home_v2vfl6ZLdP3desktop_polymer_se…, script, script, script, script, script, script, script, www-widgetapi-script: script#www-widgetapi-script, web-animations-next-lite.min/web-animations-next-lite.min: script.js-httpswwwyoutubecomytsjsbinwebanimationsnextliteminvflluX5aWwebanimationsnextliteminjs, custom-elements-es5-adapter/custom-elements-es5-adapter: script.js-httpswwwyoutubecomytsjsbincustomelementses5adaptervflsrwHZHcustomelementses5adapterjs, webcomponents-sd/webcomponents-sd: script.js-httpswwwyoutubecomytsjsbinwebcomponentssdvflPSjQ3Lwebcompo

  17. Abhinetra Kumar
    March 25, 2020 at 19:02

    let img = document.images;
    console.log(img);

  18. Abhinetra Kumar
    March 25, 2020 at 19:02

    Beauty 👍👍

  19. Danish Mohd Ahshan
    March 25, 2020 at 19:02

    great

  20. Bhavesh Warekar
    March 25, 2020 at 19:02

    console.log("Images And Scripts Tags");

    im =document.images;

    console.log(im);

    console.log("Showing Images using specified Index");

    console.log(document.images[1]);

    sc =document.scripts;

    console.log(sc);

    console.log("Showing Script using specified Index");

    console.log(document.scripts[0]);

    Images And Scripts Tags
    HTMLCollection(2) [img, img]0: img1: imglength: 2__proto__: HTMLCollection
    Showing Images using specified Index
    <img src=​"nature2.jpg">​
    HTMLCollection [script]0: script1: scriptlength: 2__proto__: HTMLCollection
    Showing Script using specified Index
    <script src=​"jsfile/​functions.js">​</script>​

  21. Nikhil Raj
    March 25, 2020 at 19:02

    Sir I have solve this quiz on this page console
    document.images
    HTMLCollection { 0: img#img.style-scope.yt-img-shadow, 1: img#img.style-scope.yt-img-shadow, 2: img#img.style-scope.yt-img-shadow, 3: img#img.style-scope.yt-img-shadow, 4: img#img.style-scope.yt-img-shadow, 5: img#img.style-scope.yt-img-shadow, 6: img#img.style-scope.yt-img-shadow, 7: img#img.style-scope.yt-img-shadow, 8: img#img.style-scope.yt-img-shadow, 9: img#img.style-scope.yt-img-shadow
    , … }

    document.images[0]
    <img id="img" class="style-scope yt-img-shadow" alt="" src="https://yt3.ggpht.com/-k…ffffff-rj-k-no/photo.jpg" width="32" height="32">

    document.images[0].src
    "https://yt3.ggpht.com/-kJBfC5yP2B8/AAAAAAAAAAI/AAAAAAAAAAA/ACHi3rdIK7wwEnPG3QbjikkyNvAcxMAUnQ/s88-mo-c-c0xffffffff-rj-k-no/photo.jpg"
    document.scripts
    HTMLCollection { 0: script, 1: script, 2: script, 3: script, 4: script, 5: script, 6: script, 7: script, 8: script, 9: script
    , … }

    document.scripts[0]
    <script src="https://www.googletagser…t/osd.js?cb=%2Fr20100101"&gt;

    document.scripts[0].src
    "https://www.googletagservices.com/activeview/js/current/osd.js?cb=%2Fr20100101"

  22. Ali Shah Raizo
    March 25, 2020 at 19:02

    bhai kya khaty ho ap

  23. NEERAJ DEWANGAN
    March 25, 2020 at 19:02

    Harry bhai please meri help kroo please mera Visual studio code install to ho gya h but Run nhi ho ra usme kuch please help kro. Bhai please

  24. Raj Abhishek
    March 25, 2020 at 19:02

    Awosem tutorial

  25. Fazle World
    March 25, 2020 at 19:02

    After completing this course Please make video for ruby and linux. Please brother. Love and respect from Bangladesh.

  26. Abu Zafar
    March 25, 2020 at 19:02

    Sir enroll android studio course please 😊

  27. vivek chourasiya
    March 25, 2020 at 19:02

    best javascript tutorial in youtube

  28. Rahmat Ali Khan
    March 25, 2020 at 19:02

    Excellent coder

  29. technology friend
    March 25, 2020 at 19:02

    ap se coding sakh kar me apne class me sab ko haran kya mare teacher ne pocha atna acha coding kaha se sakhya me bola code with harry YouTube pe kamal ka banda hai coding ase sakhta hai jise urdu hu 😎😎😎.

  30. technology friend
    March 25, 2020 at 19:02

    ap se coding sakh kar me apne class me sab ko haran kya mare teacher ne pocha atna acha coding kaha se sakhya me bola code with harry YouTube pe kamal ka banda hai coding ase sakhta hai jise urdu hu 😎😎😎.

  31. Farzam Graphics
    March 25, 2020 at 19:02

    Ui/UX Training Come with me and subscribe

Leave A Comment

You must be logged in to post a comment.