Почему оператор my if работает с оператором else if, но не с оператором OR - PullRequest
0 голосов
/ 11 октября 2018

Я написал небольшой фрагмент JS в консоли, чтобы пройти через рекомендуемые соединения в LinkedIn и, если текст содержит определенное слово, игнорировать эту карту, в противном случае нажмите кнопку закрытия 'X'.

ПервоначальноЯ написал это так:

const list = document.querySelector('.mn-pymk-list__cards');
const cards = list.querySelectorAll('.mn-pymk-list__card');

cards.forEach( (card, i) => {

  setTimeout( ()=>{
    let text = card.querySelector('.member-insights__count');

    if( !text.textContent.includes('Sharon') || text === null ) {
        card.querySelector('.pymk-card__close-btn').click();
       } else {
        card.style.background = 'green';
       }
  }, i * 1000 )

});

Однако, когда он запустился, он иногда выдавал ошибку (продолжая итерацию) с сообщением «Не удалось прочитать textContent of null».

Однако, когдаЯ написал такой код:

const list = document.querySelector('.mn-pymk-list__cards');
const cards = list.querySelectorAll('.mn-pymk-list__card');

cards.forEach( (card, i) => {

  setTimeout( ()=>{
    let text = card.querySelector('.member-insights__count');

    if( text === null ) {
        card.querySelector('.pymk-card__close-btn').click();
    } else if (!text.textContent.includes('Sharon')) {
        card.querySelector('.pymk-card__close-btn').click();
    } else {
        card.style.background = 'green';
    }
  }, i * 1000 )

});

Он работает абсолютно нормально и делает то, что я хочу.

ВОПРОС: Я не могу понять, почему первый вариант не работает,поскольку он кажется более кратким и теоретически должен делать то же самое?

Я подозреваю, что это как-то связано с тем, что в LinkedIn некоторые из предложенных контактов не имеют класса '.member-insights__count'и вместо этого иметь' .member-insights__info '.

Но это все равно должно привести к разрешению текста в ноль, верно?

Любое понимание было бы здорово!

Ответы [ 3 ]

0 голосов
/ 11 октября 2018
if( !text.textContent.includes('Sharon') || text === null ) {

Что вы ожидаете от этого кода, когда text равен нулю?Это приведет к сбою, потому что вы не можете получить доступ к свойствам или методам с нулевым значением.

Сначала вам нужно проверить на нулевое значение.

if( text === null || !text.textContent.includes('Sharon') ) {
0 голосов
/ 11 октября 2018

Оператор || оценит 2-й аргумент только в том случае, если первый аргумент имеет значение false.

В вашем случае единственная разница между первым и вторым фрагментами кода - это порядок, в котором вы проверяете, является ли значениеis null

Что вам нужно сделать, это сначала проверить на null, как это:

if( text === null ||  !text.textContent.includes('Sharon')) {

Таким образом, он будет проверять, только если text включает в себя определенный текст, как только определено, что textне равно нулю

0 голосов
/ 11 октября 2018

Если textContent имеет значение null (например, как вы сказали, вместо этого у контакта есть «.member-insights__info»), !text.textContent.includes('Sharon') вызовет сообщение об ошибке.

Во второй версии эта строка может быть достигнута только в том случае, если текст не нулевой.

...