{"id":1545,"date":"2021-03-30T23:33:37","date_gmt":"2021-03-30T22:33:37","guid":{"rendered":"https:\/\/ssntb.org\/mirozaric\/?p=1545"},"modified":"2021-03-30T23:33:37","modified_gmt":"2021-03-30T22:33:37","slug":"dom-document-object-model","status":"publish","type":"post","link":"https:\/\/ssntb.org\/mirozaric\/2021\/03\/30\/dom-document-object-model\/","title":{"rendered":"DOM (Document Object Model)"},"content":{"rendered":"\n<p>Objekt je skup varijabli (parametara) i funkcija (metoda). Web pretra\u017eiva\u010d pru\u017ea mogu\u0107nost pristupa nizu predefinisanih objekata. Prozor pretra\u017eiva\u010da u kom se prikazuje stranica naziva se <strong>window object <\/strong>(objekt prozora). HTML stranica koju prikazuje pretra\u017eiva\u010d naziva se <strong>document object <\/strong>(objekt dokumenta). Objekt dokumenta vjerovatno je naj\u010de\u0161\u0107e kori\u0161teni objekt JavaScripta na klijentovoj strani. <\/p>\n\n\n\n<p>HTML elementi koji se dodaju stranici pro\u0161iruju hijerarhiju objekata. Primjer je form element i elementi koji se nalaze unutar form elementa. Ovo zna\u010di da je mogu\u0107e referencirati svaki od dodanih objekata.<\/p>\n\n\n\n<p>DOM je skup objekata koje JavaScript jeziku dodaje pretra\u017eiva\u010d. <\/p>\n\n\n\n<p><strong>window.document.forms[0]<\/strong> &#8211; odnosi se na prvu formu unutar html dokumenta. Forme su u DOM-u implementirane kao polja. Ako postoji vi\u0161e od jedne forme u dokumentu, brojevi forme po\u010dinju od 0 i rastu za 1. <\/p>\n\n\n\n<p><strong>window.document.Forma1 <\/strong>&#8211; odnosi se na formu unutar html dokumenta naziva Forma1. <\/p>\n\n\n\n<p><strong>window.document.Forma1.Ime.value<\/strong> &#8211; odnosi se na vrijednost upisanu u textbox naziva Ime u formu unutar HTML dokumenta naziva Forma1 od strane klijenta.<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><span class=\"has-inline-color has-vivid-red-color\">&lt;html><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;head><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;title> DOM jednostavna forma<\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/title><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/head><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;body><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;form name=&#8221;Forma1&#8221;><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">Ime:<\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;input type=&#8221;text&#8221; name=&#8221;Ime&#8221; ><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;br \/><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;input type=&#8221;button&#8221; value=&#8221;Po\u0161alji informacije&#8221;><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/form><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;form name=&#8221;Forma2&#8221;><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">Ime:<\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;input type=&#8221;text&#8221; name=&#8221;Prezime&#8221; ><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;br \/><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;input type=&#8221;button&#8221; value=&#8221;Po\u0161alji informacije&#8221;><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/form><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/body><\/span><\/li><li><span class=\"has-inline-color has-vivid-red-color\">&lt;\/html><\/span><\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"603\" height=\"356\" src=\"https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-70.png\" alt=\"\" class=\"wp-image-1546\" srcset=\"https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-70.png 603w, https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-70-300x177.png 300w\" sizes=\"auto, (max-width: 603px) 100vw, 603px\" \/><figcaption>Slika 1<\/figcaption><\/figure>\n\n\n\n<p>Iako je mogu\u0107e referencirati objekt na formi bilo preko imena forme bilo preko njezina polo\u017eaja u polju formi, preporu\u010duje se koristiti referenciranje preko imena radi jednostavnijeg pra\u0107enja naziva objekata. <\/p>\n\n\n\n<p>Dijagram koji ilustruje Document Object Model (DOM):<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"931\" height=\"499\" src=\"https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-71.png\" alt=\"\" class=\"wp-image-1547\" srcset=\"https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-71.png 931w, https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-71-300x161.png 300w, https:\/\/ssntb.org\/mirozaric\/wp-content\/uploads\/2021\/03\/image-71-768x412.png 768w\" sizes=\"auto, (max-width: 931px) 100vw, 931px\" \/><figcaption>Slika 2<\/figcaption><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>Objekt je skup varijabli (parametara) i funkcija (metoda). Web pretra\u017eiva\u010d pru\u017ea mogu\u0107nost pristupa nizu predefinisanih objekata. Prozor pretra\u017eiva\u010da u kom se prikazuje stranica naziva se window object (objekt prozora). HTML stranica koju prikazuje pretra\u017eiva\u010d naziva se document object (objekt dokumenta). Objekt dokumenta vjerovatno je naj\u010de\u0161\u0107e kori\u0161teni objekt JavaScripta na klijentovoj strani. HTML elementi koji se&hellip; <br \/> <a class=\"button small blue\" href=\"https:\/\/ssntb.org\/mirozaric\/2021\/03\/30\/dom-document-object-model\/\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17],"tags":[],"class_list":["post-1545","post","type-post","status-publish","format-standard","hentry","category-17"],"_links":{"self":[{"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/posts\/1545","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/comments?post=1545"}],"version-history":[{"count":1,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/posts\/1545\/revisions"}],"predecessor-version":[{"id":1548,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/posts\/1545\/revisions\/1548"}],"wp:attachment":[{"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/media?parent=1545"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/categories?post=1545"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ssntb.org\/mirozaric\/wp-json\/wp\/v2\/tags?post=1545"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}