Q:

How do I get only the attributes as in HTML the page?

Let's assume a HTML like this (attributes aren't fixed):
<input type='text' value='a' name='A' id='A'> <br>
<input type='text' value='b' id='B'><br>
<input type='checkbox' name='C'><br>

I'd like to get only the attributes as seen in the HTML, i.e from first input: type, value, name, and id. From second, text, value and id. And so on. Not all attributes of a DOM element like .attributes property does return.
Imaginary code:
function grab_attributes(element)
{
  var result = {};
  var attributes = element.attributes;
  for(var key in attributes)
  {
    if(is_seen_in_html_page(key))
      result[key] = attributes[i];
  }
  return result;
}

So (considering above HTML as our document)
var e = document.getElementsByTagName("*") [0];
var result = grab_attributes(e);

Result is:
{type: "text", value: "a", name: "A", id: "A"}

I'm stuck on how to define the is_seen_in_html_page(e) function. I'm looking for an elegant solution as possible, without regex to get that values.

A:

They are attribute nodes, so they are instances of Attr.
function grab_attributes(element) {
  var result = {};
  var attributes = element.attributes;
  var attribute;
  for(var key in attributes) {      
    attribute = attributes[key];
    if (attribute instanceof Attr) {
      result[attribute.name] = attribute.value;
    }
  }
  return result;
}

