Jump to content

continuation of understanding what is going on in HTML DOM tutorial


hisoka

Recommended Posts

RIGHT! you apparently know why we need a handle for open/close directories in php, THINK of JAVASCRIPT OBJECT as a HANDLE to control HTML elements, you use document.getElementById(), document.getElementsByTagName() to target specific HTML element/s within a page as a JAVASCRIPT OBJECT ELEMENT, I.E HANDLE!

Link to comment
Share on other sites

AAAAAAAAAAAAAAAAAAAAAAAAAARRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGGHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHHH!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Link to comment
Share on other sites

ok Foxy Mod I used :

document.getElementById('leftmenuinnerinner')

and get :

<div id="leftmenuinnerinner" class="w3-light-grey">

as an element

 

then tried to experiment this method :

element.attribute = new value

So I had

leftmenuinnerinner.attributes

and got :

NamedNodeMap [ id="leftmenuinnerinner", class="w3-light-grey" ]

reading about NamedNodeMap here :

 

https://developer.mozilla.org/en-US/docs/Web/API/NamedNodeMap

 

I think of it as a method or a function that returns the attributes of an element . What makes me think that

id="leftmenuinnerinner", class="w3-light-grey" 

both are attributes or unities composed from variable value pair . Am I right or wrong ? if I am wrong correct me please . SO an attributes can be composed of variables- values pairs ?

Link to comment
Share on other sites

Like the documentation says, the NamedNodeMap is a list of Attr objects:

 

https://developer.mozilla.org/en-US/docs/Web/API/Attr

 

You might be getting confused by how the console is printing things. For one of those Attr object it prints id="leftmenuinnerinner", but what it actually is is an Attr object, not just the text 'id="leftmenuinnerinner"'. That's what it prints in the console because it is printing the string value of the object, and when you call Attr.toString it returns a string like what you see. It's still an object in the node map though, not just a string. It has name and value properties that you can use to get the attribute name and attribute value. The node map itself has a method to return a specific attribute by name.

Link to comment
Share on other sites

Now I know why I cannot understand easily . It is because of the technical concepts used . Because of these concepts I suffer a lot and I get confused and lost .

 

So please tell me Justsomeguy :

 

In programming context and java script , HTML context

 

What is an attribute ?

what is an object attribute ?

what is the difference between an object attribute and an attribute ?

what is the difference between a variable and an attribute ?

what is an object?

what is an interface ?

 

I need a simple and clear understandable definition for all these terms . I googled them but I got more confused :(

Edited by hisoka
Link to comment
Share on other sites

In the context of the DOM, an attribute is a "property" of an element. Specifically, a name/value pair. It has a name, and a value, and that's all.

 

what is an object attribute ?

If you're talking about an attribute of an HTML element object, it's the same as the above.

 

what is the difference between an object attribute and an attribute ?

I don't know where you got the term "object attribute" from. I didn't phrase it like that.

 

what is the difference between a variable and an attribute ?

That's kind of like asking what is the difference between a spoon and a chair. Do you know what a variable is?

 

what is an object?

https://en.wikipedia.org/wiki/Object_(computer_science)

https://en.wikipedia.org/wiki/JavaScript

 

JavaScript is almost entirely object-based. In JavaScript, an object is an associative array, augmented with a prototype (see below); each string key provides the name for an object property, and there are two syntactical ways to specify such a name: dot notation (obj.x = 10) and bracket notation (obj['x'] = 10). A property may be added, rebound, or deleted at run-time. Most properties of an object (and any property that belongs to an object's prototype inheritance chain) can be enumerated using a for...in loop.

 

JavaScript has a small number of built-in objects, including Function and Date.

Almost everything in Javascript other than control structures is an object. An object is anything that has properties or methods in Javascript.

 

what is an interface ?

A blueprint for an object. I might define an interface to say that an object which implements that interface needs to have methods called "getA", "getB", "getC", and properties called "length" and "name". I can define that interface without defining the actual object and leave it up to someone else to define a particular object which uses the required interface.
  • Like 1
Link to comment
Share on other sites

what does this mean

Attr object

 

??

 

In the context of the DOM, an attribute is a "property" of an element

 

 

and what is an attribute in JavaScript context ?

 

 

I still do not understand what is an interface . Could you explain further ?

Link to comment
Share on other sites

I know I'm going to regret this, But!

 

Context that a JavaScript object that refers to an specific html element <a title="HTML Tutorial" class="w3-hide-small" href="/html/default.asp">blah blah</a> AND ITS attributes ( A specific property associated with this JavaScript object referring to this specific html element, whose other properties include the text 'blah blah') <a title="HTML Tutorial" class="w3-hide-small" href="/html/default.asp">blah blah</a>

Link to comment
Share on other sites

what does this mean

??

 

 

and what is an attribute in JavaScript context ?

 

 

I still do not understand what is an interface . Could you explain further ?

 

Javascript does not have attributes. That's why we talk about the DOM rather than Javascript.

 

This is an interface: https://en.wikipedia.org/wiki/Protocol_%28object-oriented_programming%29

Don't ask me to simplify, if you have trouble understanding then look up words in the dictionary and look up concepts on Wikipedia.

Link to comment
Share on other sites

This is an Attr object. It is an object defined in the DOM, like an HTML element node object or like Javascript's regular Date or String objects. It's a kind of object. Like the documentation says, an Attr object represents a single attribute for a DOM element.

 

I still do not understand what is an interface . Could you explain further ?

No, but you can ask specific questions. But Javascript doesn't even have those kinds of interfaces, so I'm not sure why you're asking. If you're asking about a user interface, that's completely different.
Link to comment
Share on other sites

Sorry I will specify my question : here :

 

The NamedNodeMap interface represents a collection of Attr objects. Objects inside a NamedNodeMap are not in any particular order, unlike NodeList, although they may be accessed by an index as in an array

 

 

is mentioned the word interface and I would like to know what does it mean ?

Edited by hisoka
Link to comment
Share on other sites

Don't ask me to simplify, if you have trouble understanding then look up words in the dictionary and look up concepts on Wikipedia.

 

if dictionaries and articles helped me I would not create an account in http://w3schools.invisionzone.com and I would not ask for help . Things should be clear 100% in my mind otherwise I am not satisfied . I did not learn programming and computer science , at university , like most of you did because I did not get the opportunity because I got a very hard circumstances in my life ( let not talk about it ) if I studied it at university or got even friends who can help me in real life I would not have been here . Either you take me like I am an ignorant newbie who is in the beginning of the path or you no need to answer my question . You answered many questions and I understood very well but . I cannot pretend to understand if I did not . I am like that . So please be patient with me or let me down . I did not understand means I did not understand . Sorry man

Link to comment
Share on other sites

The MDN uses interface to mean a type of object. What they describe on the page for NamedNodeMap is the interface for the object, the list of properties and methods. That's what I described in post 32, the interface as a blueprint for an object.

 

If you don't understand something, don't just ask to have it explained again. I'll write the exact same thing. If you didn't understand something then ask questions specifically about what you didn't understand. It's your education, it's your job to move the discussion in the direction that helps you. Just saying "I don't understand, explain it again" doesn't move the discussion forward.

 

If you want high-quality answers, you need to ask high-quality questions.

  • Like 1
Link to comment
Share on other sites

Literary , I know what a blueprint means but programmatically not . For example this is an object :

<div id="headerSubnav">

what is its blueprint ? please write me its blueprint so that I know how does the blueprint of the object

<div id="headerSubnav">

look like

Link to comment
Share on other sites

That's not an object, that's an HTML tag.

 

An object would be the HTMLElement object which represents an element on the page. This page has the "blueprint" for the HTMLElement object: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement

 

When you access an HTMLElement object, as with document.getElementById(), you can access any of its properties and methods which were shown on the page I linked.

// Get the object
var element = document.getElementById("headerSubNav");

// Access one of its properties
alert(element.offsetWidth);
Link to comment
Share on other sites

You're still having problems differentiating between HTML and the DOM. HTML is just text. It's not objects. The DOM is the HTML code represented as an object structure. The DOM is where all of the objects are, not the HTML. HTML is just the language that you use to tell the browser how to create the DOM for that page.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...