Is it correct to say that the <body> element is nested within the <html> element?

Frequently Asked Questions HTML FAQ
1

Question

Is it correct to say that the <body> element is nested within the <html> element?

Answer

That is correct! The <html> tag is the root element of every page and it should always have <head> and <body> child elements. The <head> and <body> elements are siblings to each other and children to the <html> parent.

48 Likes
4

To add to this, there is one other element permitted to be a direct child of <html></html> which is more commonly found in either the <head></head> after CSS links, or in the <body></body> element at the very bottom…

<script></script>

It may appear after the </body> tag, and is valid, though not typical.

Eg.

<!DOCTYPE html>
<html lang="en">
  <head>
    
  </head>
  <body>
    
  </body>
  <script src=""></script>
  <script>
    // JS code
  </script>
</html>
60 Likes
5

Are elements also functions? or do they fall under both function and variable?

7 Likes
6

No, they are HTMLElement objects that make up the nodes from which the DOM is constructed. Are not variables, either. Both functions and variables are properties of the scripting language, usually JavaScript, but it could also be Python, Ruby, etc.

21 Likes
7

i am so confused :(:cry:

21 Likes
8

so <head>, <body> and <script> are all children of <html>, correct?

6 Likes
9

Yes and no. The convention is to write the script tag inside either/or both head and body. While browsers might accept a script outside of the head/body elements, the specification recommends,

Permitted parents Any element that accepts metadata content, or any element that accepts phrasing content.

The HTML root element can only have two children… HEAD and BODY.

<html>: The HTML Document / Root element - HTML: HyperText Markup Language | MDN

15 Likes
11

Do we have HTML tree diagram {memory Diagram}

1 Like
12

Last I recall there was one at the beginning of the HTML course.

In general,

<html>
|
<head> - <title> - <meta> - <link> - <style> - <script> - … - </head>
|
<body> - <div> - <h1> - <p> - … - </body>
|
</html>

28 Likes
13

So the src=" " part is that how you draw the source code(Java, Python, CSS, etc)
and the does that part even matter? will the computer not understand it if you use, say Spanish?

1 Like
14

The src attribute is critical since that is how we tell the browser the URL of the file we wish to request.

src="js/script.js"

The above requests the script.js file which is housed in the relative folder, js.

6 Likes
15

Thanks for all of your insight, man. Excited to learn!

4 Likes
16

You have answered one part of the question. But what he is saying is true. If you specify in the <html lang="en">, is the html going to “understand” what is written in a .js file in Spanish or another language? Regards, I’ve seen you are the most pro here in Codeacademy :p.

17

HTML does not have to understand script. The browser uses a different engine to parse the document and build the DOM. lang="en" tells the user agent that the human readable language is English.

Scripting uses another engine to parse, interpret and compile script. CSS is also another API. These two operate on the DOM, not the document itself.

4 Likes
18

does this mean that the script tag and div tag are siblings then?

19

A sibling relationship has nothing to do with tags. It refers to two elements that have the same parent.

2 Likes
20

Hi, I am still confused about these two quotes which seem to contradict each other. :worried: Admittedly, for <HTML> element, the Permitted content are <head> element and <body> element. When the <script> element directly nested inside the <HTML> element, if the <script> element is not considered a child of the <HTML> element, what’s the real relationship between them?

BTW, could you please say more to clarify the reason introducing the metadata content and phrasing content? I have noticed that the <script> element belonging to the metadata content and phrasing content.

21

When <script></script> appear in the <body></body> element, can I assume the <script> element and <div> element are siblings?

22

Any elements that are both direct children are siblings, regardless what tags they are comprised of.

If we read the specs, we find that even HEAD and BODY elements are optional. We can put our document right between the HTML tags and it will still be valid markup. Not entirely practical on a web facing page, but useful if we are inserting snippets with AJAX. The snippets will be HTML, but lacking a head and body.

When we need to include meta data we will need a HEAD, and BODY naturally follows.

1 Like
23

Sorry, I don’t understand what you explained. It is a little bit general, and I don’t know which question this answer is related to. :sob: BTW, I asked two questions yesterday and you only answered one…

3 Likes