Включает() не работает во всех браузерах

прямо здесь блок моего кода. Он отлично работает в fireFox и Chrome. Но не в IE. Я получаю сообщение об ошибке "Object doesn't support property or method 'includes'"

function rightTreeSwapfunc2() {
    if ($(".right-tree").css("background-image").includes("stage1") == true) {
        $(".right-tree").css({
            backgroundImage: "url(/plant-breeding/img/scenes/plant-breeding/stage5.jpg)"
        })
    } else {
        $(".right-tree").css({
            backgroundImage: "url(/plant-breeding/img/scenes/plant-breeding/stage3.jpg)"
        })
    }
}

Я мог бы немного изменить его и использовать vanilla JS и сделать:

document.getElementById("right-tree").classList.contains

Но я предпочел бы, есть ли способ заставить его работать в IE до изменения JS и редактирования HTML и CSS.

Ответ 1

Если вы посмотрите документацию includes(), большинство браузеров не поддерживают это свойство.

Вы можете использовать широко поддерживаемый indexOf() после преобразования свойства в строку с помощью toString():

if ($(".right-tree").css("background-image").indexOf("stage1") > -1) {
//                                           ^^^^^^^^^^^^^^^^^^^^^^

Вы также можете использовать polyfill из MDN.

if (!String.prototype.includes) {
    String.prototype.includes = function() {
        'use strict';
        return String.prototype.indexOf.apply(this, arguments) !== -1;
    };
}

Ответ 2

IE11 реализует String.prototype.includes, так почему бы не использовать официальный Polyfill?

Источник: полифилл источник

  if (!String.prototype.includes) {
    String.prototype.includes = function(search, start) {
      if (typeof start !== 'number') {
        start = 0;
      }

      if (start + search.length > this.length) {
        return false;
      } else {
        return this.indexOf(search, start) !== -1;
      }
    };
  }

Ответ 3

В моем случае я нашел лучше использовать "string.search".

var str = "Some very very very long string";
var n = str.search("very");

В случае, если это будет полезно для кого-то.

Ответ 4

Еще одно решение - использовать contains, который вернет true или false

_ содержит ($ ( ". right-tree" ). css ( "background-image" ), "stage1" )

Надеюсь, что это поможет