Twitter Widget不允许我更改URL

时间:2018-11-15 14:25:47

标签: javascript twitter widget

我已将twitter小部件嵌入到HTML中。我有一个JS对象,其中包含10个Twitter个人资料的URL。我想做一个函数,让我用对象中的另一个替换当前URL(在小部件中)。 但是,在运行脚本时,href不会更改(错误说是null)。

Twitter是否可以阻止对HTML类中的href或其他标签进行任何更改?

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>

  <p>
    <a class="twitter-timeline" id="twitter" data-width="300" data-height="500" href="https://twitter.com/Tesla"></a>
  </p>

  <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

  <button onclick="change()">Change link</button> <button onclick="check()">Preview link</button>

  <script>
    var URL = document.getElementById("twitter").href;
    console.log(URL);

    function change() {
      alert(document.getElementById("twitter").href = "https://twitter.com/IBMref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor");
    }

    function check() {
      console.log(document.getElementById("twitter").href);
    }
  </script>


</body>

</html>

1 个答案:

答案 0 :(得分:0)

确实发生了更改,您只是对更改本身发出了警报。

var URL = document.getElementById("twitter").href;
console.log(URL);

function change() {
  document.getElementById("twitter").href = "https://twitter.com/IBM?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor";
  alert(document.getElementById("twitter").href);
}

function check() {
  console.log(document.getElementById("twitter").href);
}
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</head>

<body>
  <p>
    <a class="twitter-timeline" id="twitter" data-width="300" data-height="500" href="https://twitter.com/Tesla"></a>
  </p>
  <button onclick="change()">Change link</button>
  <button onclick="check()">Preview link</button>
</body>

</html>