Can id attributes only be used on <div> tags?

Question

In this exercise we give multiple <div> tags an id. Can any opening <html> tag have an id attribute or can only opening <div> tags have this attribute?

Answer

Any opening <html> tag can have an id attribute. While the id attribute defines an identifier which should be unique to the whole document, it is not uncommon for several different <html> tags to have unique id attributes. To find out which attributes are available to every tag, take a look at this list of global attributes.

46 Likes

Do i need to use quote marks in an ID attribute?

10 Likes

Do we need to? Try it and see. Should we always quote attributes? Yes.

33 Likes

I have a question; and really appreciate your responses. As some one learns to code, are there resources/guides/books/sites that tell you how and what to do? You don’t have to memorize all these html codes, right? where do you find that information?

Also, on this website we have a little project that we type into, and it highlights our mistakes. Are there programs that do the same when you are writing HTMl? if not, is it pretty hard to go back and see your mistakes?

ALSO, 1 more question - are there search functions within html coding? some really long files could take forever to look through, right?
thanks!

14 Likes

Yes, plenty of them. Start with the documentation on w3.org. Try a search,

html elements list site:w3.org

We will do very well to study usage, permitted attributes and validation. This will lead you to UI best practices, usability and accessibility.

Top of the list for usage guidance is MDN (Mozilla Developer Network) but you will quickly add to that bookmark many other authority sites. SitePoint offers a good lot of resources to learners. Their Premium plan is affordable and opens up their massive library of reading resources.

Syntax highlighting is available in all text editors that recognize HTML, CSS, etc. For beginners there is a very popular and well equipped Notepad++. When you reach the level where you are truly commited to developing, then it will be worthwhile looking into paid for IDE’s, but not until then.

You can test drive several online developer environments such as repl.it, codepen, &c. which can prove very useful since they have built in linting, which is the feature you asked about. Once you get on with your learning you may wish to look into a linter plug-in for your text editor.

The common search tools usually found in the Edit menu of a text editor are more than adequate. Editors will have segment toggling to hide large sections of code to tuck it out of the way. They help to track nesting, as well. Once you discover and learn to use the many tools in your free editor, you’ll be more at home and less distracted once you move up to more professional workflow environments.

Be sure to make good use of validation. validator.w3.org

41 Likes

why does the solution not show the word “Introduction” on the final page? Very confusing.

I am quite annoyed Im getting to the point where I am losing track because nothing is clearly explained

6 Likes

This does not appear bc it is used to organize information. The purpose as mentioned in the begining of the lesson is the “name” of an attribute and/or “value” of an attribute.

1 Like

Let’s say we have this…

<body>
text
<p>P-node</p>
</body>

How many text nodes are there?

Several different elements can have a unique id attribute within one whole document? Thanks for the link, to the HTML Elements.

1 Like

Correct, so long as they are unique. Note that ID is a hash in an URL so can be included in a link.

<article id="identifiers">

</article>

and the link,

<a href="http://example.com/blog.html#identifiers">Fragment Identifiers</a>
3 Likes

How many text nodes are there?

Since a text node is a node, it too has a text node, so for an element there are two text nodes. It doesn’t propagate from there. Attributes have values, which are themselves, text nodes. Add the number of these to the net total of text nodes on an element.

Nodes are objects with properties. The properties are not nodes. My bad.

So, are there four text nodes? Are you saying that a pair of opening and closing tags count as one node, and the content inside of them count as one node? So, in total (Text

P-node

) count as four nodes?

A P-node has two text nodes. That’s what I’m saying. Same applies to any HTML element. The text node has a text node.

Please share with us any search results you get from searching on this detail.

3 Likes

One thing for new people and others who might see this. Programming will have you cover issues that could be as small as fixing a period, a semicolon, and you name it. Coding, in general, is an act of juggling perfection and problem solving because that is what the computer understands (perfect syntax and structure along with problem-solving if done correctly). So, you, me, and anyone else will have to get used to the fact that you may be scouring a piece of program or even HTML just to fix a period or some white-space that causes an error. Which, this also includes scouring for resources and more information, and this is to say, everything isn’t perfect with Codecademy. Some things are left open-ended and are to help you build off your own curiosity, creativity, and learning abilities because the internet has plenty of resources. I am a fellow paying member so don’t mistake me for a worker; I too get frustrated with how things work with Codecademy’s site. If something like this bothers you though, then you may have to reconsider why you want to work with computers because that is what we work with at the end of the day here. Take everything and every day with a small step forward, and ask questions. If you get annoyed, then ask yourself why and analyze what’s going on. With love and respect :slight_smile:

11 Likes

well said sir. Everyone should take it as this.

I completely agree with @christophermcgoldric statement! Well said indeed!!!

Here are some great resources to learn:

  1. For many coding languages : Other than courses on codecademy, check out sololearn (also available in app), github,( Code camp) Grasshopper by google, mimo, w3schools (for learning many coding languages, on a free website) etc.
  2. For javascript here’s a great free online book: https://eloquentjavascript.net/index.html (It’s great for beginners, just be attentive!)
  3. To practice writing code, go to :
    codepen (for writing, and running html, css and JS. You can also see others code files there to learn from others experience. You can make your pens and save them in codepen so others can see your files) I highly recommend codepen. It highlights mistakes when you press the three dots and then analyze javascript/html/css in your pen (code files are called pens in codepen)
    Notepad and wordpad, which you will find already installed on laptops can be used for testing html. When saving file, write ( .html) at the end of it’s name. Then, go to google chrome and press (ctrl + o) to run your html file. Many code playground apps are also available for running code.

As you write more and practice coding, you will soon have all codes memorized, it’s actually quite easy and fun. All the material I have given above is free (but there is probably a paid version also available in most)
This is all only from my opinion though, but as my mother tongue isn’t English (though I’m good at it) and I’m young, I assure you that the content I’ve given won’t be too hard to understand.
Hope this helped!
Love nature, coding, and me, Mia Woods.

10 Likes