Question

182

How do I view the properties of a DOM object in Chrome Developer?

rated 0 times [ 188] [ 6] / answers: 1 / hits: 18959 / 12 Years ago, sun, july 8, 2012, 12:00:00

I want to examine the properties of a DOM object in Google Chrome Web Developer Tools, so I called console.debug(); with a DOM element as a parameter:

HTML:

<audio controls=controls>

  <source src=http://upload.wikimedia.org/wikipedia/commons/6/65/Star_Spangled_Banner_instrumental.ogg type=audio/ogg />

  Your browser does not support the audio tag.

</audio>

Javascript:

console.debug(document.getElementsByTagName('source')[0]);

JS Fiddle

However, the Chrome console just displays the HTML of the element upon the call to console.debug(); and does not reveal any javascript properties of the DOM node object.

How do I view the properties of a DOM object in Chrome Developer? I'm using a Mac.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

hanna

Add To Favorites

Follow

Total Points: 66

Total Questions: 99

Total Answers: 101

Location: Saudi Arabia

Member since Sat, Aug 20, 2022

2 Years ago

hanna questions

1 How to test RTK Query with react testing library?

Fri, Jun 3, 22, 00:00, 2 Years ago

1 Next.js - using another < div>< /div> throws error, why?

Tue, Dec 28, 21, 00:00, 2 Years ago

1 Get user banner in discord.js

Sun, Jul 11, 21, 00:00, 3 Years ago

1 Formik Material UI React - Autocomplete - uncontrolled to controlled state

Sat, Aug 8, 20, 00:00, 4 Years ago

1 Property 'content' does not exist on type 'HTMLElement' in Typescript

Thu, Jun 18, 20, 00:00, 4 Years ago

View All

answered 12 Years ago beatriceisabelad · Accepted Answer

What you want to do is add attributes tag to the end. This will return an array of the attributes. You may need the JavaScript Kit to actually do this, but then you can just have a loop to go through the attributes no matter how many there are.

sourceAttributes = document.getElementsByTagName('source')[0].attributes

for(int i=0; i<sourceAttributes.length; i++) {

    console.debug(sourceAttributes[i]);

}