Uncaught TypeError: Невозможно прочитать свойство 'click' из нулевого расширения Chrome - PullRequest
0 голосов
/ 03 октября 2019

Я пытаюсь сделать расширение Chrome: оно выдает всплывающее окно и выполняет автоматический клик по моей корзине, где идентификатор устанавливается мной из элемента inspect.

Хотя мне не удалось написать код, в котором я мог бы установить идентификатор для определенных элементов класса на веб-сайте (любом веб-сайте с помощью расширения Chrome)

Что происходит, когда я запускаю этот код послеустановка идентификатора этого элемента вручную с помощью элемента inspect:

Я пробовал различные методы, такие как document.getElementByid (). click ();

, а также с переменным методом, но ни один из них не работал

   jQuery.noConflict();
    {
        var my_text=prompt('Enter Your Tickets ');
        addclick(my_text);

    }

    function addclick(v){
        var button;
        for (i = 1; i <= v; i++) {
            //document.getElementById('clicker').click();
            button = document.getElementById('clicker')
                button.click();
                alert(i);


        }
    }

Этот скрипт прекрасно работает, если вы пытаетесь запустить его из консоли, но не из расширения Chrome, даже после того, как все разрешения установлены

Ошибка, которую я получил:

Uncaught TypeError: Невозможно прочитать свойство 'click' из null

Ответы [ 3 ]

3 голосов
/ 03 октября 2019

Ваш код выполняется до загрузки элемента #clicker (так как он выше него);следовательно, этот элемент не существует в тот момент, document.getElementById возвращает null и, следовательно, ошибку.

Чтобы решить его, оберните ваш код функцией и вызовите его черезjQuery() или событие DOMContentLoaded :

jQuery.noConflict();
jQuery(()=>{
    var my_text=prompt('Enter Your Tickets ');
    addclick(my_text);
})

function addclick(v){
    var button;
    for (i = 1; i <= v; i++) {
        //document.getElementById('clicker').click();
        button = document.getElementById('clicker')
        button.click();
        alert(i);
    }
}

Или:

jQuery.noConflict();
document.addEventListener('DOMContentLoaded',()=>{
    var my_text=prompt('Enter Your Tickets ');
    addclick(my_text);
})

function addclick(v){
    var button;
    for (i = 1; i <= v; i++) {
        //document.getElementById('clicker').click();
        button = document.getElementById('clicker')
        button.click();
        alert(i);
    }
}

Здесь представлены исполняемые фрагменты с вашим полным кодом:

<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>
    jQuery(() => {
      jQuery('.btn-pls').attr('id', 'clicker'); {
        var my_text = prompt('Enter Your Tickets ');
        addclick(my_text);

      }
    })

    function addclick(v) {
      for (i = 1; i <= v; i++) {
        //document.getElementById('clicker').click();
        var button = document.getElementById('clicker');
        button.click();
        alert(i);
      }
    }
  </script>
  <style>
    .cart-item-btns .v-button {
      float: right;
      height: 40px;
      margin: 2px;
      min-width: 75px;
      font-size: 22px;
    }
    
    .cart-item-main {
      padding: 8px;
    }
    
    .catalog-item.selected {
      background-color: #fecc00;
      cursor: default;
    }
    
    .catalog-item {
      position: relative;
      cursor: pointer;
      height: 40px;
      overflow: hidden;
    }
    
    .catalog-item.selected {
      background-color: #fecc00;
      cursor: default;
    }
    
    .cart-item:last-child {
      border-bottom: none;
    }
  </style>
</head>

<body>
  <div>Chrome Extension By Love Chauhan</div><br/>
  <div class="cart-item-btns">
    <div class="v-button btn-qty hl-green"><i class="fa fa-hashtag"></i></div>
    <div class="v-button btn-pls hl-green"><i class="fa fa-plus" id="clicker"></i></div>
    <div class="v-button btn-min hl-green disabled"><i class="fa fa-minus"></i></div>
    <div class="v-button btn-del hl-red"><i class="fa fa-trash"></i></div>
    <div class="v-button btn-seat hl-green disabled v-hidden" title="limited capacity 40 new - VisitaSingoli
"></div>
  </div>
</body>

</html>

<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script>
    document.addEventListener('DOMContentLoaded', () => {
      jQuery('.btn-pls').attr('id', 'clicker'); {
        var my_text = prompt('Enter Your Tickets ');
        addclick(my_text);

      }
    })

    function addclick(v) {
      for (i = 1; i <= v; i++) {
        //document.getElementById('clicker').click();
        var button = document.getElementById('clicker');
        button.click();
        alert(i);
      }
    }
  </script>
  <style>
    .cart-item-btns .v-button {
      float: right;
      height: 40px;
      margin: 2px;
      min-width: 75px;
      font-size: 22px;
    }
    
    .cart-item-main {
      padding: 8px;
    }
    
    .catalog-item.selected {
      background-color: #fecc00;
      cursor: default;
    }
    
    .catalog-item {
      position: relative;
      cursor: pointer;
      height: 40px;
      overflow: hidden;
    }
    
    .catalog-item.selected {
      background-color: #fecc00;
      cursor: default;
    }
    
    .cart-item:last-child {
      border-bottom: none;
    }
  </style>
</head>

<body>
  <div>Chrome Extension By Love Chauhan</div><br/>
  <div class="cart-item-btns">
    <div class="v-button btn-qty hl-green"><i class="fa fa-hashtag"></i></div>
    <div class="v-button btn-pls hl-green"><i class="fa fa-plus" id="clicker"></i></div>
    <div class="v-button btn-min hl-green disabled"><i class="fa fa-minus"></i></div>
    <div class="v-button btn-del hl-red"><i class="fa fa-trash"></i></div>
    <div class="v-button btn-seat hl-green disabled v-hidden" title="limited capacity 40 new - VisitaSingoli
"></div>
  </div>
</body>

</html>
0 голосов
/ 07 октября 2019

Спасибо за вашу помощь, но я использовал элементы DOM для решения своих проблем.

Еще раз спасибо.

Ура !!!

0 голосов
/ 03 октября 2019

Помимо ожидания загрузки DOM и предотвращения нежелательных ошибок, попробуйте:

var button = document.getElementById('clicker')
if (button) {
    button.click();
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...