CODEWITHSUNDEEP
javascript
user9240010
user9240010

Reputation:

getting Arial Label value from list of buttons

So we have various buttons which looks like this 

  var val =  document.querySelectorAll('button[aria-label]')[0].value;
  console.log(val);
<button aria-label="Connect with Trijay Sharda" data-control-name="srp_profile_actions" class="search-result__actions--primary button-secondary-medium m5" data-ember-action="" data-ember-action-6704="6704" data-is-animating-click="true">Connect</button>

<button aria-label="Connect with Vibhor Jain" data-control-name="srp_profile_actions" class="search-result__actions--primary button-secondary-medium m5" data-ember-action="" data-ember-action-7497="7497">Connect</button>

But this just returns an empty string.

[Question] So I have two questions, Why does it returns empty string and how can I grab the value of aria-label here?

Upvotes: 0

Views: 354

Answers (1)

Chris
Chris

Reputation: 2806

document.querySelectorAll('button[aria-label]')[0] is giving you the button element.

So you're seeing the .value of the button element. If you want to see Connect then you can access the .innerText.

.getAttribute('aria-label') will give you the value of your aria label.

  var button =  document.querySelectorAll('button[aria-label]')[0];
  console.log(button.getAttribute('aria-label')); // Connect with Trijay Sharda
  console.log(button.innerText); // Connect
<button aria-label="Connect with Trijay Sharda" data-control-name="srp_profile_actions" class="search-result__actions--primary button-secondary-medium m5" data-ember-action="" data-ember-action-6704="6704" data-is-animating-click="true">Connect</button>

<button aria-label="Connect with Vibhor Jain" data-control-name="srp_profile_actions" class="search-result__actions--primary button-secondary-medium m5" data-ember-action="" data-ember-action-7497="7497">Connect</button>

Upvotes: 1

Related Questions