Twitter Widget won't let me change the URL
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;
I have embedded the twitter widget in an HTML. I have a JS object that contains URLs of 10 twitter profiles. I want to make a function that would let me replace the current URL (in the widget) with another one from the object.
However when running the script, the href will not change (error say its null).
Does Twitter maybe prevent any changes to href or other tags inside the HTML class?
<!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>
javascript twitter widget
add a comment |
I have embedded the twitter widget in an HTML. I have a JS object that contains URLs of 10 twitter profiles. I want to make a function that would let me replace the current URL (in the widget) with another one from the object.
However when running the script, the href will not change (error say its null).
Does Twitter maybe prevent any changes to href or other tags inside the HTML class?
<!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>
javascript twitter widget
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19
add a comment |
I have embedded the twitter widget in an HTML. I have a JS object that contains URLs of 10 twitter profiles. I want to make a function that would let me replace the current URL (in the widget) with another one from the object.
However when running the script, the href will not change (error say its null).
Does Twitter maybe prevent any changes to href or other tags inside the HTML class?
<!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>
javascript twitter widget
I have embedded the twitter widget in an HTML. I have a JS object that contains URLs of 10 twitter profiles. I want to make a function that would let me replace the current URL (in the widget) with another one from the object.
However when running the script, the href will not change (error say its null).
Does Twitter maybe prevent any changes to href or other tags inside the HTML class?
<!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>
<!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>
<!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>
javascript twitter widget
javascript twitter widget
edited Nov 15 '18 at 15:56
O.O
859422
859422
asked Nov 15 '18 at 14:25
Mister CbsMister Cbs
1
1
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19
add a comment |
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19
add a comment |
1 Answer
1
active
oldest
votes
It did change, you just called alert on the change itself.
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>
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53321589%2ftwitter-widget-wont-let-me-change-the-url%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
It did change, you just called alert on the change itself.
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>
add a comment |
It did change, you just called alert on the change itself.
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>
add a comment |
It did change, you just called alert on the change itself.
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>
It did change, you just called alert on the change itself.
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>
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>
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>
edited Mar 9 at 6:05
Bhargav Rao♦
31.1k2093114
31.1k2093114
answered Nov 15 '18 at 15:17
O.OO.O
859422
859422
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53321589%2ftwitter-widget-wont-let-me-change-the-url%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Cannot replicate this Null Error.
– O.O
Nov 15 '18 at 15:19