{"id":1245,"date":"2023-05-21T07:12:47","date_gmt":"2023-05-21T07:12:47","guid":{"rendered":"https:\/\/itnotes.apjsoftwares.com\/?p=1245"},"modified":"2023-05-21T07:12:48","modified_gmt":"2023-05-21T07:12:48","slug":"getelementsbytagname-example","status":"publish","type":"post","link":"https:\/\/itnotes.apjsoftwares.in\/index.php\/2023\/05\/21\/getelementsbytagname-example\/","title":{"rendered":"getElementsByTagName Example"},"content":{"rendered":"\n

getElementsByTagName: To access elements and attributes using tag name. This method will return an array of all the items with the same tag name.<\/p>\n\n\n\n

<html>\n\n<head>\n\n    <title>DOM!!!<\/title>\n\n<\/head>\n\n<body>\n\n  <h3>Welcome<\/h3>\n\n  <p>This is the welcome message.<\/p>\n\n  <h3>Technology<\/h3>\n\n  <p id=\"second\">This is the technology section.<\/p>\n\n  <script type=\"text\/javascript\">\n\n    var paragraphs = document.getElementsByTagName(\"p\");\n\n    alert(\"Content in the second paragraph is \" + paragraphs[1].innerHTML);\n\n    document.getElementById(\"second\").innerHTML = \"The orginal message is changed.\";\n\n  <\/script>\n\n<\/body>\n\n<\/html>\n<\/pre>\n\n\n\n
Event handler Example<\/h4>\n\n\n\n
    \n
  1. createElement: To create new element<\/li>\n\n\n\n
  2. removeChild: Remove an element<\/li>\n\n\n\n
  3. you can add an event handler<\/strong> to a particular element like this<\/li>\n<\/ol>\n\n\n\n
        document.getElementById(id).onclick=function()\n        {\n            lines of code to be executed\n        }\n<\/pre>\n\n\n\n
    OR<\/p>\n\n\n\n
    document.getElementById(id).addEventListener(\"click\", functionname)\n<\/pre>\n\n\n\n
    Example:<\/strong><\/p>\n\n\n\n
    <html>\n<head>\n    <title>DOM!!!<\/title>\n<\/head>\n<body>\n  <input type=\"button\" id=\"btnClick\" value=\"Click Me!!\" \/>\n  <script type=\"text\/javascript\">\n    document.getElementById(\"btnClick\").addEventListener(\"click\", clicked);\n    function clicked()\n    {\n            alert(\"You clicked me!!!\");\n    }    \n  <\/script>\n<\/body>\n<\/html>\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
    getElementsByTagName: To access elements and attributes using tag name. This method will return an array…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[23],"tags":[],"_links":{"self":[{"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/posts\/1245"}],"collection":[{"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/comments?post=1245"}],"version-history":[{"count":1,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/posts\/1245\/revisions"}],"predecessor-version":[{"id":1246,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/posts\/1245\/revisions\/1246"}],"wp:attachment":[{"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/media?parent=1245"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/categories?post=1245"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itnotes.apjsoftwares.in\/index.php\/wp-json\/wp\/v2\/tags?post=1245"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}