how do i check the textcontent inside a button. the if statement isnt recognising the text-CodePudding

Linkedin search result so on the search page i want to only select the buttons with connect on them. the if statement doesnt seem to check if connect is the text content.

var buttons = document.getElementsByClassName('artdeco-button artdeco-button--2 artdeco-button--secondary ember-view')
for (var i = 0; i < buttons.length; i  ) {
  console.log(buttons[i].textContent)
  if (buttons[i].textContent == 'Connect') {
    console.log(i)
  }

}

<button aria-label="Invite x to connect" id="ember82" class="artdeco-button artdeco-button--2 artdeco-button--secondary ember-view"><!---->
    <span class="artdeco-button__text">
        Connect
    </span></button>

result Shouldnt the connect have an corresponding i?

CodePudding user response：

You are performing an exact match on the string "Connect" which fails because the textContent in your example also includes a bunch of whitespace.

You can use String.prototype.trim() to remove it before testing.

var buttons = document.getElementsByClassName('artdeco-button artdeco-button--2 artdeco-button--secondary ember-view')
for (var i = 0; i < buttons.length; i  ) {
  console.log(buttons[i].textContent)
  if (buttons[i].textContent.trim() == 'Connect') {
    console.log(i)
  }

}

<button aria-label="Invite x to connect" id="ember82" class="artdeco-button artdeco-button--2 artdeco-button--secondary ember-view"><!---->
    <span class="artdeco-button__text">
        Connect
    </span></button>

CodePudding user response：

I don't know what you looking for but here it is. I used span rater than button class (you can use button classes but span just reduce line of code)

 var buttons = document.getElementsByClassName(
'artdeco-button__text'
)

  for (var i = 0; i < buttons.length; i  ) {
    if (buttons[i].textContent.trim() == 'Connect') {
      console.log(i);
      console.log(buttons[i]);
    }
    
  }