Getting HTML elements by their attribute names

Question

There are methods available in JavaScript to get HTML elements using their ID  Class and Tag   document getElementByID  id    document getElementsByClassName  class    document getElementsByTagName  tag      Is there any method available to get the elements according to the attribute name   EX     lt span property  v name  gt Basil Grilled Tomatoes and Onions lt  span gt    Like   document getElementsByAttributeName  property

User · Answer

In jQuery this is so      span  property  v name        for selecting your span element

User · Answer

Just another answer  Array prototype filter call      document getElementsByTagName  span        function el   return el getAttribute  property       v name         In future  Array prototype filter call      document getElementsByTagName  span         el    gt  el getAttribute  property       v name      3rd party edit  Intro   The call   method calls a function with a given this value and arguments provided individually  The filter   method creates a new array with all elements that pass the test implemented by the provided function    Given this html markup   lt span property  a  gt apple - no match lt  span gt   lt span property  v name  gt onion - match lt  span gt   lt span property  b  gt root - match lt  span gt   lt span property  v name  gt tomato - match lt  span gt   lt br   gt   lt button onclick  findSpan    gt find span lt  button gt    you can use this javascript  function findSpan         var spans   document getElementsByTagName  span        var spansV   Array prototype filter call           spans           function el   return el getAttribute  property       v name               return spansV      See demo

User · Answer

I think you want to take a look at jQuery since that Javascript library provides a lot of functionality you might want to use in this kind of cases  In your case you could write  or find one on the internet  a hasAttribute method  like so  not tested      fn hasAttribute   function tagName  attrName     var result           each   tagName   function index  value          var attr     this  attr attrName         if  typeof attr      undefined   amp  amp  attr     false          result push   this            return result

User · Answer

Yes  the function is querySelectorAll  or querySelector for a single element   which allows you to use CSS selectors to find elements  document querySelectorAll   property        All with attribute named  quot property quot  document querySelectorAll   property  quot value quot         All with  quot property quot  set to  quot value quot  exactly    Complete list of attribute selectors on MDN   This finds all elements with the attribute property  It would be better to specify a tag name if possible  document querySelectorAll  span property      You can work around this if necessary by looping through all the elements on the page to see whether they have the attribute set  var withProperty           els   document getElementsByTagName  span       or     for all types of element     i   0   for  i   0  i  lt  els length  i          if  els i  hasAttribute  property              withProperty push els i             Libraries such as jQuery handle this for you  it s probably a good idea to let them do the heavy lifting  For anyone dealing with ancient browsers  note that querySelectorAll was introduced to Internet Explorer in v8  2009  and fully supported in IE9  All modern browsers support it

User · Answer

With prototypejs         span property v name       or   document body select  span property v name       Both return an array

User · Answer

You can use querySelectorAll       document querySelectorAll  span property name

User · Answer

You can get attribute using javascript   element getAttribute attributeName     Ex   var wrap   document getElementById  wrap    var myattr   wrap getAttribute  title      Refer   https   developer mozilla org en DOM element getAttribute

[javascript] Getting HTML elements by their attribute names

Examples related to javascript

Examples related to html

Examples related to dom