Geek asks and answers

How to view properties of a DOM object in Chrome Developer?

I want to examine the properties of a DOM object in Google Chrome Web Developer Tools, so I named the console.debug();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 feed

However, the Chrome console simply displays the HTML code of the element when invoked console.debug();and does not show any javascript properties of the DOM node object.

How to view properties of a DOM object in Chrome Developer? I am using a Mac.

+5
source share
1 answer

, . . , JavaScript , , , , .

sourceAttributes = document.getElementsByTagName('source')[0].attributes
for(int i=0; i<sourceAttributes.length; i++) {
    console.debug(sourceAttributes[i]);
}
+4

More articles:


All Articles