возникает ошибка Uncaught TypeError: Cannot set property 'search' of null после подключения twitter.com/widgets.js

360

08 июня 2017, 09:06

Дано две кнопки, одна из них твиттер, другая обычная. Я хочу устанавливать свои параметры для ссылки и значения для атрибута data-text

Все работает, но если подключить (что необходимо, чтобы работала твиттер-кнопка)

<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>

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

document.getElementById("myTweet").search = param;
document.getElementById("myTweet").setAttribute('data-text', "someValue");

сразу ругается и выдает ошибки:

Uncaught TypeError: Cannot set property 'search' of null pen.js:13

Uncaught TypeError: Cannot read property 'setAttribute' of null

Т.е. убираю скрипт widgets.js - мой скрипт работает, устанавливает параметры для ссылки, значения для атрибута data-text, но перестает работать твиттер-кнопка. Подключаю - наоборот мой код не работает, не могу установить параметры и значения для атрибута. Как исправить или может есть иной путь.

ниже ссылка на код https://codepen.io/sibkedr/pen/GEJWdL

$("document").ready(function() { 
 
  var count = 0; 
  $("#btnSetParam").on("click", function() { 
    var param = "text=" + encodeURIComponent('"new Value-"') + count++; 
      setNewParam(param); 
  }); 
 
  function setNewParam(param) { 
    document.getElementById("myTweet").search = param; 
    console.log(document.getElementById("myTweet").search); 
 
    document.getElementById("myTweet").setAttribute('data-text', "someValue"); 
    var dataAttr = document.getElementById("myTweet").getAttribute('data-text'); 
    console.log(dataAttr); 
  }; 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="container mt-5 px-2 py-2"> 
  <a id="myTweet" href="https://twitter.com/intent/tweet?button_hashtag=quote" class="twitter-hashtag-button" data-text="Here a quote" data-show-count="false">Tweet #quote</a> 
  <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script> 
  <button id="btnSetParam" type="button" class="btn btn-success">Success</button> 
</div>