Welcome to Scribd, the world's digital library. Read, publish, and share books and documents. See more
Standard view
Full view
of .
Look up keyword
Like this
0 of .
Results for:
No results containing your search query
P. 1
Course Notes for Unit 2 of the Udacity Course CS262 Programming Languages

Course Notes for Unit 2 of the Udacity Course CS262 Programming Languages

Ratings: (0)|Views: 72 |Likes:
Published by Iain McCulloch
Course Notes for Unit 2 of the Udacity Course CS262 Programming Languages
Course Notes for Unit 2 of the Udacity Course CS262 Programming Languages

More info:

Published by: Iain McCulloch on Aug 22, 2012
Copyright:Attribution Non-commercial


Read on Scribd mobile: iPhone, iPad and Android.
download as PDF or read online from Scribd
See more
See less



In the last unit, we learned about regular expressions and finite state machines. Wesaw that regular expressions are a concise notation that we can use to denote or matcha number of strings. We learned how to use regular expressions in Python byimporting the functions and data types from the regular expression library,re. We sawhow we could turn regular expressions into finite state machines that accept the samelanguage as our regular expressions.In this unit, we're going to combine those concepts to make a lexical analyzer, aprogram that reads in a web page or a bit of JavaScript and breaks it down into words, just like we might break an English sentence down into words. This is going to be areally important tool in our arsenal, and it's one of the first steps towards making aweb browser.
First we need to learn how to specify important parts of HTML and JavaScript, andwe're going to do this specification using regular expressions.Remember, the goal of the overall project is to start with a web page and then break itdown into important words while largely ignoring white space or new line characters.Then we want to take those words and diagram them into a tree-like structure, andfinally we’ll interpret that tree to figure out what it means to get the result.
HTML stands for "hypertextmarkuplanguage." You may have some previous experience with HTML, but that's not necessary for this course. HTML was inventedby Tim Berners-Lee around 1990. For our purposes, HTML just tells a web browserhow to display a webpage. In fact, HTML is not all that different from using symbolslike stars or underscores to emphasis text that you're writing to someone else.Consider this line of HTML:I <b>really</b> like you.In HTML the special punctuation <b> means "let's do some bold now", and </b>means "I'm done with bold, let's go back to normal". These are called HTML 'tags'.The <b> is called the 'opening tag', while </b> is the 'closing tag'. When rendered in aweb browser, this will appear as:I
like you
Other HTML tags that are commonly used for emphasising text include underline,<u>underline</u>, and italics, <i>italic</i>.
Really Quiz
Which of these HTML fragments show the word ‘really’ in bold?
George Orwell was <b>really</b> Eric Blair.
George Orwell was </b>really<b> Eric Blair.
George Orwell was <b> really</b> Eric Blair.
<b>George Orwell was really Eric Blair.</b>
We have seen the HTML <b> tag that modifies text by telling the browser to displayit as bold. Another very common tag is the anchor tag <a>, which is used to addhyperlinks to web pages. In some ways, this is the defining characteristic of what itmeans to be a webpage. Here is a fragment of HTML that includes such an anchor tag.Click here <a href="www.google.com"> now! </a>It begins with <a, but unlike the relatively simple bold and underline tags, the anchortag has an argument. This means pretty much the same thing it did when we weretalking about functions in Python. Here, the argument or modifier for the anchor tag is
href =
. This stands for
hypertext reference
- the target of the link. After the href =we have a string that is a URL, a web address, in this case to Google. The text in themiddle (‘now!’) is often rendered in blue with an underline, although it doesn't haveto be. The anchor tag ends with </a>For this fragment of HTML, the words "Click here now!" will be drawn on the screen.The word ‘now!’ will be a hyperlink.

You're Reading a Free Preview

/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->