{"id":189,"date":"2013-06-19T16:48:07","date_gmt":"2013-06-19T23:48:07","guid":{"rendered":"http:\/\/courses.haigarmen.com\/isma309\/?p=189"},"modified":"2013-06-19T16:54:58","modified_gmt":"2013-06-19T23:54:58","slug":"dom","status":"publish","type":"post","link":"https:\/\/courses.haigarmen.com\/isma309\/dom\/","title":{"rendered":"Document Object Model"},"content":{"rendered":"<p>We can&#8217;t talk about JavaScript without mentioning the <strong>DOM<\/strong>, an important concept to understand about how javascript works. The <strong>Document Object Model<\/strong> or DOM provides a structural representation of an HTML or XML document, enabling us to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages or alternately, one could say it&#8217;s our window into modifying HTML pages programatically (on the fly). <\/p>\n<p>Here&#8217;s a really simple bit of code:<\/p>\n<pre lang=\"HTML\">\r\n\t\tdocument.write(\"Hi there.\")\r\n<\/pre>\n<p>\tIn this code, <strong>document<\/strong> is the object. <strong>write<\/strong> is the method of this object. Let\u2019s have a look at some of the other methods that the document object possesses.<\/p>\n<p>You can always include the last update date on your page by using the following code:<\/p>\n<pre lang=\"HTML\">\r\n\t\t<script language=\"JavaScript\">\r\n\t\tdocument.write(\"This page created by John N. Last update:\" + document.lastModified);\r\n\t\t<\/script> \r\n<\/pre>\n<p>\tAll you need to do here is use the lastModified property of the document. Notice that we used + to put together This page created by John N. Last update: and document.lastModified.<\/p>\n<p>\tLets try playing around with bgColor and fgColor:<\/p>\n<pre lang=\"HTML\">\r\n\t\t<script>\r\n\t\t\tdocument.bgColor=\"black\"\r\n\t\t\tdocument.fgColor=\"#336699\"\r\n\t\t<\/script> \r\n\t<\/pre>\n<p>Next up: <a href=\"http:\/\/courses.haigarmen.com\/isma309\/message-boxes\/\" title=\"Message Boxes\">Message Boxes<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>We can&#8217;t talk about JavaScript without mentioning the DOM, an important concept to understand about how javascript works. The Document Object Model or DOM provides a structural representation of an HTML or XML document, enabling us to modify its content and visual presentation. Essentially, it connects web pages to scripts or programming languages or alternately, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5,7],"tags":[],"class_list":["post-189","post","type-post","status-publish","format-standard","hentry","category-exercises","category-javascript"],"_links":{"self":[{"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/posts\/189","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/comments?post=189"}],"version-history":[{"count":3,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/posts\/189\/revisions"}],"predecessor-version":[{"id":191,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/posts\/189\/revisions\/191"}],"wp:attachment":[{"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/media?parent=189"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/categories?post=189"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.haigarmen.com\/isma309\/wp-json\/wp\/v2\/tags?post=189"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}