Skip to main content

Taking on the DOM !!!


IT'S TIME TO LEARN THE DOM 😆

Today I am tackling the DOM so the FIRST thing I did was to put on my StarWars shirt!  I am definitely going to need the Force to be with me as I learn how to access and manipulate XML and HTML in the DOM.

First thing first----> What is the DOM?

DOM stands for Document Object Model.  It is the browser's representation of the page in memory.  The browser creates the DOM to allow us to modify and change XML, HTML, and CSS.  If you change the DOM, you change the page (using JavaScript).

WHY would we want to work in the DOM?

It is a useful tool for developers because it allows  a website to be manipulated in a live environment.  Once changes made are acceptable and approved, that code that was implemented in the DOM can then be copied over to the actual XML/HTML index file.  It can then be saved and implemented so that the website will have the current changes for all end users.

How do we access the DOM and how does it work?

Whenever a webpage is loaded, the browser automatically creates the DOM for that page.  To access the DOM, you can right click on the page you are viewing.  Select "Inspect", then select "Console".  Type "document."  then press return.  Now you will see the DOM.


In the picture above, I went into the DOM on Yahoo's webpage.  Notice that I typed "document." above right.

I am using a Mac, so to access the DOM above, I used the short cut 'Option Command J' instead of right clicking, Inspect, etc.


Look for my next post where I talk about DOM selectors.
Follow me as I learn to build my website bit by bit!    IronTreeDev.com








Comments

Post a Comment

Popular posts from this blog

XPATH and XPATH Expressions In XMLLINT

XPATH And XPATH Expressions Earlier, I told you about xmllint and xmllint for html files .  Let's say you just want to parse the <span> tags within your html file or just your <span lang="el"> tags? Enter:  Xpath. Xpath is yet another option available within the xmllint language. Remember, an Xpath is used to navigate through elements and attributes in xml and html documents.  Xpath uses Xpath Expressions to select nodes or node sets within a document. Example 1 .  Looking for all of the <span> tags within an html document. xmllint -- html -- xpath " // span" StedmanLesson10.html xmllint = This tells the command line that we are going to be using the xmllint language. space = because we always have space in between commands -- = Remember, these are the two hyphen-minus characters that we need to tell the command line that we are going to use an xmllint option. html = This is the xmllint option we want to
Post a Comment
Read more

Back To The Basics

Click photo above to see photo clearly  It's Been A LOOONG Minute since I have coded!!   Even so, I decided to give JavaScript another try.  I always seem to do good and then when I get to this one area, I always seem to hit a brick wall.  Well....nothing like getting back up and trying again right?   I decided to try Rithm School's online JavaScript Fundamentals FREE course .  I have never joined their school but their free courses tend to explain things in a way my brain understands it.  💁 To let you know how much I have forgotten in the coding world, I couldn't even remember how to write the basic commands for an HTML document! Yesterday I started the fundamentals free course and I am so glad that I did.  Because of time, I only made it through the JavaScript History and Setup chapter, but that chapter was enough to get my memory flowing again!   It started to feel familiar and I quickly remembered why I enjoyed coding so much.  Yesterday and this morning, I just erased
Post a Comment
Read more

GIT Commands: Pull, Add, Commit, Push.....and sometimes Revert

Pull, Add, Commit, Push ...... then Repeat We talked about GIT, GIT Hub , and the three different areas GIT works in.  Now it is time to talk about some of the most used GIT commands.   I am currently working with a team on a project called Stedman.  We are all using the GIT Hub server to track our work as we make changes to the files within the Stedman project.   Many changes can be made by other members of the team, from the time I sign off to the time I sign back on.  How do I get the changes they made to a file I need to work on, onto my computer? ENTER GIT COMMANDS : 1.  The first thing I do is goto my command window on my computer and navigate to the directory where the file I want to work in is located (this will be a directory that is being tracked by GIT).   *If you need a quick refresher:  cd file_name   will take you through each of your directories until you reach your desired location.  Issuing an  ls   command will list the files (sub-di
Post a Comment
Read more