I need to save the source code of any website in a java script variable. For example, saving Google source code in a variable "GoogleSourceCode".
I tried some ways but I don't have enough knowledge for that.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
</head>
<body>
<div id="container">
<button id="acessaSite">Acessa Site</button>
<button id="pegarHTMLagora">pegar HTML agora</button>
</div>
<script>
$('#acessaSite').on('click', function () {
$.getJSON('http://www.whateverorigin.org/get?url=' + encodeURIComponent('https://google.com.br') + '&callback=?', function(data){
alert(dados.conteudo);
});
});
$('#pegarHTMLagora').on('click', function () {
var htmlAgora = document.documentElement.innerHTML; // Javascript vanilla (sem jquery)
alert(htmlAgora);
});
let htmlPego = document.documentElement.innerHTML;
</script>
</body>
</html>
Related
I need to pass a data value from the HTML to the Google Script on a GAS project. The parts with comments of the code is the value I need to pass.
gs file
function doGet(e) {
if (e.parameter.prefix){
var result = data; // <-- GET VALUE "data" FROM THE HTML "forms.html"
var content = e.parameters.prefix + '(' +JSON.stringify(result) + ')';
return ContentService.createTextOutput(content)
.setMimeType(ContentService.MimeType.JAVASCRIPT);
}
var html = HtmlService.createHtmlOutputFromFile('Index');
return html.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
Index.html in GAS project
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<h1 id='title' style="color: #e31414">SCRIPT</h1>
<h1 id='done' style="display: none"> DATA PASSED</h1>
<button id="btn" onclick="passData()">Run "passData()"</button>
</body>
</html>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
function passData() {
$('#done').show();
var data = 'value'; //<-- PASS THIS DATA TO GOOGLE SCRIPT (The .gs file)
}
</script>
Follow these steps:
in the gs file, create a variable without a value at the very top: var data;
Create a function below it like so:
function myfunction(x) {
data = x;
}
in the Index.html file especially in passData() function, insert this line in the bottom of the function: google.script.run.myfunction(data);
Finally, you will be able to use the result variable as the data in doGet() function.
-- your code should look like this --
gs file
var data;
function myfunction(x) {
data = x;
}
function doGet(e) {
if (e.parameter.prefix){
var result = data; // <-- GET VALUE "data" FROM THE HTML "forms.html"
var content = e.parameters.prefix + '(' +JSON.stringify(result) + ')';
return ContentService.createTextOutput(content)
.setMimeType(ContentService.MimeType.JAVASCRIPT);
}
var html = HtmlService.createHtmlOutputFromFile('Index');
return html.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
Index.html in GAS project
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<h1 id='title' style="color: #e31414">SCRIPT</h1>
<h1 id='done' style="display: none"> DATA PASSED</h1>
<button id="btn" onclick="passData()">Run "passData()"</button>
</body>
</html>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
function passData() {
$('#done').show();
var data = 'value'; //<-- PASS THIS DATA TO GOOGLE SCRIPT (The .gs file)
google.script.run.myfunction(data);
}
</script>
I'm trying to handle translations with Mustache.js and it works fine for some part of the code but not for another part.
<script>
function MyFunction() {
// If a submit button is pressed, do some stuff and run this function to display the result
var tmpText = "";
tmpText = "<b>{{someTextInJSfunction}}</b>"; // this is NOT OK
document.getElementById("totalText").innerHTML = tmpText;
}
</script>
</head>
<body>
<div id="sampleArea">
</div>
<script id="personTpl" type="text/template">
<span id="totalText"></span></p>
<b>{{ImpNotice}}</b> {{Contact}} // this is OK
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="js/mustache.js"></script>
<script>
$( document ).ready(function() {
var lang = 'en_us';
$.getJSON('json/'+lang+'.json', function(data) {
var template = $('#personTpl').html();
var html = Mustache.to_html(template, data);
$('#sampleArea').html(html);
});
});
</script>
When I click a Submit button, my JS function is called and depending on some calculation, some text should be displayed in the page. This is the part that doesn't work, {{someTextInJSfunction}} is displayed instead of the actual content of {{someTextInJSfunction}}.
The content of {{ImpNotice}} and {{Contact}} is correctly displayed because I assume the variables are located in the <script id="personTpl"> tags.
I'm not sure how to fix it for the variables located in my JS functions, such as {{someTextInJSfunction}}.
I have two examples using setTimeout(). This one works:
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type="text/javascript">
google.load('visualization','1',{packages:['table']});
function start() {
setTimeout(ShowClipboardContent, 2000);
}
function ShowClipboardContent() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('div'));
table.draw(data,{showRowNumber: true});
}
</script>
</head>
<body>
<button onclick='start();'>Show text data in clipboard</button>
<div id='div'></div>
</body>
</html>
But this doesn't:
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization','1',{packages:['table']});
</script>
<script type='text/javascript'>
//runs powershell and copies output onto clipboard
function powershell(t) {
//object that will execute powershell
var run = new ActiveXObject("Shell.Application");
//breaks the list of servers into array
var servers = t.textarea.value.split('\n');
//script that powershell will run
var script = 'some powershell command';
//path to powershell.exe
var program = 'C:\\Windows\\system32\\WindowsPowerShell\\v1.0\\powershell.exe';
//putting it all together
run.ShellExecute(program,script,'','open','1');
setTimeout(drawTable, 10000);
}
//draws data table using data from clipboard
function drawTable() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('table'));
table.draw(data, {showRowNumber: true});
}
</script>
</head>
<body>
<div id='form'>
<form>
Enter name(s):<br />
<textarea id='textarea' style='width:20%; height:500px;'></textarea><br />
<button onclick='powershell(this.form)'>Query</button>
</form>
</div>
<div id='table'></div>
</body>
</html>
Just to reiterate: the problem is that setTimeout() won't work on the second code but works on the first one and I would like to know why because I see no difference.
try to add a
console.log(drawTable);
just before your timeout. if it returns 'function', it'a good, your timeout will be ok. if not return anything, your activeX script should break the code
Using the Soundcloud JavaScript API, I want to dynamically generate a page of player widgets using track search results. My code is as follows:
<html>
<head>
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
function makeDivsFromTracks(tracks,SC)
{
var track;
var permUrl;
var newDiv;
for(var ctr=0;ctr<tracks.length;ctr++)
{
newDiv=document.createElement("div");
newDiv.id="track"+ctr;
track=tracks[ctr];
SC.oEmbed(track.permalink_url,{color:"ff0066"},newDiv);
document.body.appendChild(newDiv);
}
}
</script>
</head>
<body>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.get('/tracks',{duration:{to:900000},tags:'hitech',downloadable:true},
function(tracks,SC)
{
makeDivsFromTracks(tracks,SC);
});
</script>
</body>
</html>
When I load this, the SC.oEmbed() call throws an error:
Uncaught TypeError: Cannot call method 'oEmbed' of null
which would seem to indicate that either the divs aren't being generated or the search results aren't being returned, but if I remove the SC.oEmbed() call and replace it with:
newDiv.innerHTML=track.permalink_url;
then I get a nice list of the URLs for my search results.
And if I create a widget using a static div and static URL, e.g.
<body>
<div id="putTheWidgetHere"></div>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.oEmbed("http://soundcloud.com/exampleTrack", {color: "ff0066"}, document.getElementById("putTheWidgetHere"));
</script>
</body>
then that works fine as well. So what's the problem with my oEmbed() call with these dynamically created elements?
Solved it. I took out the SC argument from the callback function and makeDivsFromTracks(), and now all the players show up. Not sure exactly why this works--maybe it has to do with the SC object being defined in the SDK script reference, so it's globally available and doesn't need to be passed into functions?
Anyways, working code is:
<html>
<head>
<script src="http://connect.soundcloud.com/sdk.js"></script>
<script>
function makeDivsFromTracks(tracks)
{
var track;
var permUrl;
var newDiv;
for(var ctr=0;ctr<tracks.length;ctr++)
{
newDiv=document.createElement("div");
newDiv.id="track"+ctr;
track=tracks[ctr];
//newDiv.innerHTML=track.permalink_url;
SC.oEmbed(track.permalink_url,{color:"ff0066"},newDiv);
document.body.appendChild(newDiv);
}
}
</script>
</head>
<body>
<script>
SC.initialize({
client_id: 'MY_CLIENT_ID'
});
SC.get('/tracks',{duration:{from:180000,to:900000},tags:'hitech',downloadable:true},function
(tracks){makeDivsFromTracks(tracks);});
</script>
</body>
</html>
I'm trying to use Knockout js in a simple web application.
Here's my dummy javascript code:
function MainViewModel() {
this.myText = ko.observable('Hello world');
}
var MainViewModelInstance = new MainViewModel();
ko.applyBindings(MainViewModelInstance);
But when I run the index.html, the debug console says "ko.applyBindings is not a function"!
Help!
Thanks
You have not included the link to the knockout.js library in your source code or the link is wrong. Fix this and it will work.
<script src="/scripts/knockout-2.0.0.js" type="text/javascript"></script>
Where the /scripts directory is the location on the server where knockoutjs resides.
EDIT
Here is an example of your code that works.
<html>
<head>
<script src="knockout-2.0.0.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
function MainViewModel() {
this.myText = ko.observable('Hello world');
}
var MainViewModelInstance = new MainViewModel();
ko.applyBindings(MainViewModelInstance);
</script>
</body>
</html>