I'm trying to get a query string from htm file.
But when I'm writing a "?param=1" in the end of the .htm url - the file not loaded and I don't see anything in this page - The error I get is: "Incorrect document syntax".
When I'm opened this url without the query string in the end, its opened normally.
This is my htm file:
<html>
<head>
<title>Test Url sender</title>
<meta charset="utf-8">
</head>
<body>
<script src="file.js" type="text/javascript"></script>
<style type="text/css">
body {
font-size: 12px;
margin: 0px 10px;
}
</style>
<script type="text/javascript">
window.onload = getQueryString();
function getQueryString() {
var queryString = window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape("param").replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1");
SendUrlsToServer(queryString);
}
</script>
<p>
test paragraph
</p>
</body>
</html>
(The function SendUrlsToServer its from another js file).
I need to get a query string in this url..
This htm file is web resource in crm.
Any help how can I solve this?
Thanks.
In CRM, a webpage (HTML) or Silverlight web resource page can only accept a single custom parameter called data.
anything else will cause problem.
Read More...
You are looking for "urls" in the parameter but sending "param" instead !
Change escape("urls") to escape("param") if you will be sending "param"
Try below code snippet
<html>
<head>
<title>Test Url sender</title>
<meta charset="utf-8">
</head>
<body>
<style type="text/css">
body {
font-size: 12px;
margin: 0px 10px;
}
</style>
<script type="text/javascript">
window.onload = getQueryString();
function getQueryString() {
var queryString = window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape("params").replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1");
SendUrlsToServer(queryString);
}
function SendUrlsToServer(x)
{
if(x.length > 0)
alert(x);
}
</script>
<p>
test paragraph
</p>
</body>
</html>
Related
I scraped a web page with the price of bitcoin and have the complete web page code stored in a variable. How do I extract the span:
<span class="text-large2" data-currency-value>8128.61</span>
from the whole code? By the way the number 8128.61 changes every time the page is refreshed as the price is updated
Here is my full code:
$.getJSON('http://www.whateverorigin.org/get?url=' + encodeURIComponent('https://coinmarketcap.com/currencies/bitcoin/') + '&callback=?', function(data){
console.log(data.contents);
});
body {
background-color: lightblue;
}
<!DOCTYPE html>
<html>
<body>
<html lang="en">
<head>
<title>Web Scraper</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="js/scripts.js"></script>
</body>
</html>
</body>
you can use something like below to extract the value
$.getJSON('http://www.whateverorigin.org/get?url=' + encodeURIComponent('https://coinmarketcap.com/currencies/bitcoin/') + '&callback=?', function(data){
console.log($(data.contents).find('span[data-currency-value]').html());
});
you can do this without Jquery also
var htmlData = `your html`;
var divNode = document.createElement("div");
divNode.innerHTML = html;
after this you can access all HTML element which is inside htmlData
like
divNode.getElementsByClassName("test")
I have been working with jQuery/JavaScript and ajax for the first time and I am trying to work with the weather underground API to display some weather information on a web-page hosted on google cloud.
I have been reading the weather underground code example and I am trying to work with that which is why the code will look so familiar but I am just trying to get it to work so I can move forward. I have also looked at other stack overflow where similar code questions were asked but I am still not getting anywhere. I apologize for the redundancy but I am unsure why it is not working.
Everything seems to be making sense but when the HTML is suppose to "alert" when the page is loaded I am getting nothing. I would really appreciate some input even if I am doing something stupid just want to get this chunk working in order to move forward.
Below is my HTML file that is a mix of JavaScript and HTML.
<!DOCTYPE html>
<html>
<head>
<title>Hello, The Cloud!</title>
<link rel="stylesheet" type="text/css" href="/static/style.css">
</head>
<body>
<h1>Hello, The Cloud!</h1>
<p> Lets Check the Weather! </p>
</body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$.ajax({
url : "http://api.wunderground.com/api/47acb7d74302f585/geolookup/conditions/q/IA/Cedar_Rapids.json",
dataType : "jsonp",
success : function(parsed_json) {
var location = parsed_json['location']['city'];
var temp_f = parsed_json['current_observation']['temp_f'];
alert("Current temperature in " + location + " is: " + temp_f);
}
});
});
</script>
</html>
My simple CSS file is shown below.
h1 {
color: #000000;
text-align: center;
font-size: 60px;
text-decoration: underline;
}
body {
background-color: LavenderBlush;
font-size: 20px;
}
div {
background-color: lightgrey;
color: #FF0000;
id: "clockbox";
font-size: 20px;
font-family: "Times New Roman", Times, Serif;
width: 420px;
padding: 10px;
border: 5px solid gray;
margin: 0;
}
.alert {
padding: 20px;
background-color: #f44336; /* Red */
color: white;
margin-bottom: 15px;
}
I appreciate any feedback!
Thank you
Thanks to some great advice from #GAEfan and yuriy636 I was able to figure out that Google Cloud does not play well with HTTP requests thus it was just a simple change from HTTP to HTTPS in the URL's as you can see in the code below.
<!DOCTYPE html>
<html>
<head>
<title>Hello, The Cloud!</title>
<link rel="stylesheet" type="text/css" href="/static/style.css">
</head>
<body>
<h1>Hello, The Cloud!</h1>
<p> Lets Check the Weather! </p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$.ajax({
url : "https://api.wunderground.com/api/47acb7d74302f585/geolookup/conditions/q/IA/Cedar_Rapids.json",
success : function(parsed_json) {
console.log(parsed_json);
var location = parsed_json['location']['city'];
var temp_f = parsed_json['current_observation']['temp_f'];
alert("Current temperature in " + location + " is: " + temp_f);
}
});
});
</script>
</body>
</html>
Here is a link to more info on Google Cloud and HTTP/HTTPS: https://cloud.google.com/compute/docs/load-balancing/http/
Thank you for everyone's help!
The problem is that you don't have <script> tags inside your <body> tag.
This is what I mean:
<!DOCTYPE html>
<html>
<head>
<title>Hello, The Cloud!</title>
<link rel="stylesheet" type="text/css" href="/static/style.css">
</head>
<body>
<h1>Hello, The Cloud!</h1>
<p> Lets Check the Weather! </p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($) {
$.ajax({
url : "http://api.wunderground.com/api/47acb7d74302f585/geolookup/conditions/q/IA/Cedar_Rapids.json",
success : function(parsed_json) {
var location = parsed_json['location']['city'];
var temp_f = parsed_json['current_observation']['temp_f'];
alert("Current temperature in " + location + " is: " + temp_f);
}
});
});
</script>
</body>
</html>
If you hit an error first, you won't get to the alert. Try adding this logging, to make sure you aren't getting a key error:
jQuery(document).ready(function($) {
$.ajax({
url : "http://api.wunderground.com/api/47acb7d74302f585/geolookup/conditions/q/IA/Cedar_Rapids.json",
dataType : "jsonp",
success : function(parsed_json) {
console.log(parsed_json);
var location = parsed_json['location']['city'];
var temp_f = parsed_json['current_observation']['temp_f'];
alert("Current temperature in " + location + " is: " + temp_f);
}
});
});
I'm making a little application with intel xdk I have already passed id values from one page to another. My problem is when I print some links in html I can't pass value from the other page. I'm trying by this way:
<script>
document.write("<a href='#' onclick='sendID('page2.html', '21')'>Link</a>");
</script>
I have passed id value from one page to another but in this case I need to pass from a printed link. Is it possible or there is another way. Thanks!
Also I don't know if there is another way to call a function that receives parameters when the link is printed.
More information. Into my head tag:
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function sendID(dir, id)
{
dir +="?";
nomVec = id.split(",");
for (i=0; i<nomVec.length; i++){
dir += nomVec[i] + "=" + nomVec[i]+"&";
}
dir = dir.substring(0,dir.length-1);
location.href=dir;
}
</script>
</head>
And in my body tag:
<body>
Right link<br>
<br>
<br>
<script>
document.write("<a href='#' onclick='sendID(page2.html, 21)'>Link</a>");
</script>
</body>
In the first link the function is called and I get redirected to the other page, but in the printed link is doesn't work.
You have to do something like this
<body>
<script type="text/javascript">
function sendID(dir, id)
{
dir +="?";
nomVec = id.split(",");
for (i=0; i<nomVec.length; i++){
dir += nomVec[i] + "=" + nomVec[i]+"&";
}
return dir.substring(0,dir.length-1);
}
</script>
<script>
document.write("Link");
</script>
</body>
alternatively
you can also do a document.write(<<escape and put the sendID javascript function here>>) following by the document.write that prints the anchor tag.
<!DOCTYPE html>
<html>
<style type="text/css">
</style>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">
function sendID(dir, id)
{
dir +="?";
nomVec = id.split(",");
for (i=0; i<nomVec.length; i++){
dir += nomVec[i] + "=" + nomVec[i]+"&";
}
dir = dir.substring(0,dir.length-1);
location.href=dir;
}
</script>
</head>
<body>
click here
<br>
<br>
<script>
document.write("<a href='#' onclick='sendID(page2.html, 21)'>Link</a>");
</script>
</body>
</body>
</html>
I have put together a Cross-Document Messaging implementation between a site and an iframe. It woks great. But I desire to communicate between tabs, not iframes.
Here is the code I have, for the iframe communication in 2 parts. The first is the Master page and the other is the remote or slave page.
So, MASTER page here...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Cross-Document Messaging Receiver</title>
<!-- <script type='text/javascript' src='js/xDocMess.js'></script> -->
<link rel="stylesheet" type="text/css" href="css/xDocMess.css">
<script type="text/javascript">
function sendMessage() {
//select the iframe containing the message receiver remote script
var remoteframe = document.getElementById("remotepage");
//Get the users message from the message input box
var message = document.getElementById("message").value;
//Check that the message is not blank
if (message !== "") {
remoteframe.contentWindow.postMessage(message, 'http://localhost:8081');
}
else {
alert("You cannot send a blank message!");
}
}
</script>
</head>
<body>
<h1>Cross-Domain Messaging Example</h1>
<div id="controls">
<label>Enter your message to be sent to the iframe: </label>
<input type="text" id="message" />
<button id="sendmessage" onclick="sendMessage();">Send Message</button>
<p>(Note: Only alphanumeric characters will be printed!)</p>
</div>
<h3>Remote Script iframe</h3>
<iframe id="remotepage" src="http://localhost:8081/remote.html"></iframe>
</body>
And now, the REMOTE site here...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Remote Receiver</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css">
<style type='text/css'>
body {
font-family: sans-serif;
padding: 10px;
}
h3 {
padding-bottom: 5px;
}
#messages {
font-size: small;
border-top: 1px solid #000;
padding-top: 10px;
}
</style>
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
function receiver(message) {
//get the message container html element (in this case, the messages div)
var messagecontainer = document.getElementById("messages");
var trusteddomain = "http://localhost:8081";
//Get the time of message receipt
var currenttime = new Date();
//format the time into a user readable format
var formattedtime = currenttime.getHours() + ":" + currenttime.getMinutes() + ":" + currenttime.getSeconds();
var msgcontent = message.data;
//check the content of the message only contains letters and numbers to prevent xss attacks
if (msgcontent.match(/^[A-Za-z0-9]+$/)) {
messagecontainer.innerHTML += "message received # " + formattedtime + ": " + message.data + "<br />";
} else {
messagecontainer.innerHTML += "Illegal characters found in the message received # " + formattedtime + ". Message rejected<br/>";
}
}
}
</script>
</head>
<body>
<h3>Messages Received:</h3>
<div id="messages"></div>
</body>
</html>
The solution lies in how to call a window.open instead of invoking the IFRAME in the MASTER: <iframe id="remotepage" src="http://localhost:8081/remote.html"></iframe> and changing the sendmessage code line:
var remoteframe = document.getElementById("remotepage");
and be able to pass messages to the window. I have a mental block there...
Any help would be appreciated...
TIA
Dennis
If I understand your question, I believe all you need to do is name your window when you call window.open and then use this reference in your code just like you would the contentWindow of an iframe:
var myWindow = window.open('newTab.html');
myWindow.postMessage('You\'re a nice looking window', 'http://yourtargetdomain.com');
You would then put the 'message' handler inside the newTab.html document
window.addEventListener('message', function (event) {
// security check ...
console.log('message: ' + event.data);
});
It can be done only using an iFrame.
Page, loaded in an iFrame, acts as a proxy, translating message events into localStorage events, and vice-versa.
localStorage is separate for each domain, that's why it can't be implemented in two different tabs.
If I have some hidden element on a page, that contains some content, how can I create a link and when user clicks it, browser would open a new window and show the content (only the content, for example some json data)?
ps. I know that's probably bad idea to have some hidden content on the page. It's better to put an action link that will get the content from the server.. But it involves many other headaches and it wasn't me who created the page, so please just let me know if there's a comparatively easy solution...
Please use http://okonet.ru/projects/modalbox/index.html with inline content setting
You could pass the (URL encoded) contents of the hidden element as an argument in the URL when opening the second page. That argument could then be (unencoded and) inserted into the body of the second page when it loads.
The following example works locally on OS X. On other operating systems, the example may need to be placed on an actual web server before it will work:
page1.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 1</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function openwindow(){
window.open("page2.html?html="+escape($("#myDiv").html()));
}
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
Click Me!
<div class="hidden" id="myDiv">
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/6/6e/HTML5-logo.svg/200px-HTML5-logo.svg.png">
<p>See the HTML5 specification</p>
</div>
</body>
</html>
page2.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Page 2</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
jQuery.extend({
// from: http://paulgueller.com/2011/04/26/parse-the-querystring-with-jquery/
parseQuerystring: function(){
var nvpair = {};
var qs = window.location.search.replace('?', '');
var pairs = qs.split('&');
$.each(pairs, function(i, v){
var pair = v.split('=');
nvpair[pair[0]] = pair[1];
});
return nvpair;
}
});
</script>
<script>
$(document).ready(function(){
$(document.body).html(unescape(jQuery.parseQuerystring().html));
});
</script>
<style>
.hidden {
visibility: hidden;
}
</style>
</head>
<body>
<!-- this will be replaced -->
</body>
</html>