How to read the values from the dynamically added script tag in head using jquery / javascript
Question
I have a script tag which is getting from the service. I am just appending it to the head part of the html.
Its getting appended but the thing is it has some values which I need to access in my application.
<script>
abc.header.value = "1";
abc.header.path = "/abc/def/ghi?isThirdParty=false&version=v123";
</script>
Once the script is added to header if I try to access abc.header.value it's throwing undefined.
How to access values from the added script. and also i have a global object, is there a way to added all this dynamically added values to that object?
sample Snippet: I am getting script tag from the ajax call and am storing it in a variable.
var sampSnip = "<script> abc.header.value = "1"; abc.header.path = "/abc/def/ghi?isThirdParty=false&version=v123"; </script>";
$('head').append(sampSnip);
1 answers
solution1
1 ACCPTED 2015-12-30 11:30:25
Take a look at this simple signin form I just wrote for you.
//HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles/index.css">
<script src="scripts/index.js"></script>
</head>
<body>
<form>
<input type="text" name="username" placeholder="username">
<input type="password" name="password" placeholder="password">
<input id='signin' type="button" value="Sign In">
</form>
</body>
</html>
//JS
document.addEventListener("DOMContentLoaded", init);
function init(){
document.getElementById('signin').addEventListener('click', click.signin);
}
var click = {
"signin": function(e){
e.preventDefault();
var inputs = e.target.parentNode.children;
var data = new FormData();
var client = new XMLHttpRequest();
for(var i=0; i < inputs.length; i++){
if(inputs[i].type !== 'button'){
data.append('credentials['+inputs[i].name+']', inputs[i].value);
}
}
client.addEventListener("load", callback.signin);
client.open("POST", "/core/signin.php");
client.send(data);
}
};
var callback = {
"signin": function(e){
var data = JSON.parse(e.target.response);
console.log(data);
}
};
//PHP
<?php
echo json_encode($_POST['credentials']);
?>
//CSS
body{
margin: 0 !important;
height: 100vh;
width: 100vw;
display: -webkit-flex;
display: flex;
text-align: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-flex-direction: column;
flex-direction: column;
background-color: #0B9AD8;
-webkit-background-size: cover;
background-size: cover;
}
form{
display: -webkit-flex;
display: flex;
-webkit-align-self: center;
align-self: center;
-webkit-flex-direction: column;
flex-direction: column;
padding: 1em;
margin: 0 !important;
background-color: #ECF0F1;
-webkit-border-radius: .3em;
border-radius: .3em;
-webkit-box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.40);
box-shadow: 0px 2px 7px rgba(0, 0, 0, 0.40);
}
input{
width:22em;
height: 3em;
font-size: 1em;
font-weight: lighter !important; /* FIREFOX */
display: block;
margin-bottom: .5em;
outline: none;
text-align: center;
background-color: #fff;
border: 1px solid #d5dadc;
-webkit-border-radius: 2px;
border-radius: 2px;
padding: 0 !important; /* FIREFOX */
}
input:-webkit-autofill{
-webkit-box-shadow: 0 0 0px 1000px white inset;
}
input[type="button"]{
cursor: pointer;
border: 1px solid #0089C4;
color: #fff;
background: #0089C4;
margin-bottom: 0 !important;
}
input[type="button"]:hover{
background: #0B9AD8;
}
input[type="button"]:active{
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset;
-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) inset;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.