CODEWITHSUNDEEP
javascriptangularjs
Jake
Jake

Reputation: 95

Inner text from selector

I tried to take the inner text from this markup:

<span ng-if="vm.totalRecords > 1" class="ng-binding ng-scope">
    Displaying results 1-25 of 17,430
</span>

Using this selector:

document.querySelectorAll('div.Dashboard-section div.pure-u-1-1 span.ng-binding.ng-scope').innerText

It returns undefined. Any suggestions what am I doing wrong?

Upvotes: 2

Views: 1922

Answers (2)

Ayan
Ayan

Reputation: 2380

document.getElementsByTagName can be used to fetch the span elements and then select the first of them.

console.log(document.getElementsByTagName('span')[0].innerText);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<span ng-if="vm.totalRecords > 1" class="ng-binding ng-scope">Displaying results 1-25 of 17,430</span>

Upvotes: 2

TrampolineTales
TrampolineTales

Reputation: 826

You need to do the following:

console.log(document.querySelectorAll('span')[0].innerText);
<span ng-if="vm.totalRecords > 1" class="ng-binding ng-scope">Displaying results 1-25 of 17,430</span>

This will log the innerText as opposed to the other code due to two reasons:

  1. Using querySelectorAll returns a list of results, hence why we use [0] to reference the first found element.

  2. The actual query from your querySelectorAll couldn't find the HTML element. Simply using span as the query is enough.

Upvotes: 1

Related Questions