Well I was working with javascript for my project and found out something interesting. In my javascript code when I do something like
<!DOCTYPE html>
<html>
<head>
<title>Array</title>
</head>
<body>
<script>
var location = ["Kathmandu","Bhaktapur","Lalitpur"];
console.log(location);
</script>
</body>
</html>
save the file as array.html and when I try to run the webpage the URL changes indicating filename as 'Kathmandu,Bhaktapur,Lalitpur'. I am surprised myself with this behaviour and wanted to know why it happen. Btw I am using safari as my web-browser and haven`t tried this on any other browser.
location is an object that holds the location/url of the page, so you should avoid using it as a variable.
Location Object
The location object contains information about the current URL.
The location object is part of the window object and is accessed
through the window.location property.
http://www.w3schools.com/jsref/obj_location.asp
Related
I wonder if it's possible to navigate to a web page via link and zoom in to be 150%?
The only thing I could think about is to rewrite the '.click()' function and change the css there such as '-moz-transform', maybe something like this:
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<a href="https://www.google.com/search?q=kobe&igu=1" id="myLink" ></a>
</body>
<script>
$('#myLink').click(function() { zoom_page() });
function zoom_page()
{
// DO SOMETHING HERE!!
}
function autoClick() {
document.getElementById('myLink').click()
}
window.addEventListener("load", autoClick);
</script>
</html>
but not sure how exactly to do it.
Anyone can help? Thanks!
Andy
Given your example uses the URL of a well-known public site which you, almost certainly. have no control over: You can't do that.
Any JavaScript you run will apply to the current page and not the next one you navigate to.
If you could run JavaScript on arbitrary third-party websites then there would be a major XSS problem everywhere.
If you had control over the destination page then you could modify it with server-side code or JS embedded in the destination page contingent on data passed from the previous page (e.g. via the URL's query string).
I need to create a new HTML page using javascript.
To do that I tried using the window object
let myDocument = window;
myDocument.document.write(`
<html>
<head>
<title>${title}</title>
</head>
<body><section id="print"></section></body>
</html>
`)
My problem is that I would like to generate that on the background and save the result somewhere in my project.
The user cannot see a new page open or a new window
The new HTML has to be saved
These are the two problems I have at the moment.
I can generate the page, but I could not find out how to do that on the background.
My limitation is that the project uses pure javascript so Node.js packages might not work.
Instead of document.write you can save it in a variable & use it when you want or save it through service or localStorage.
You code must be like:
const title = "Hello World!";
let myDocument =
`<html>
<head>
<title>${title}</title>
</head>
<body><section id="print"></section></body>
</html>`;
console.log(myDocument);
I have problems with accessing the location attribute of the window object, which I need to redirect the user to another page via JavaScript/jQuery. I know you normally should use an .htaccess file to do this, but I'm actually writing an nw.js application, so I have no server.
Here is an example source code:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery-3.2.1.js">
</script>
<script>
$(function() {
$("#testbutton").click(function() {
$("#testbutton).before($(window).attr("location"));
});
});
</script>
</head>
<body>
<button type="button" id="testbutton">Click me</button>
</body>
</html>
This should, if it worked, get the value of the location attribute and insert it before the button when the button gets clicked.
In reality, it doesn't do anything. I also tried to assign the value of the location attribute to a variable, or write this in plain JavaScript (which I intend to avoid), but neither did change the fact that nothing happens.
Is it possible to access the location attribute of the window object via jquery? And if it's possible, what's my mistake?
I wanted to print the value first before changing it, because I like to develop projects step by step. I know this code is not going to change the location attribute, but I wonder why it's not even getting the value?
You don't need jQuery....just access the location.href directly
$(function() {
$("#testbutton").click(function() {
$("#testbutton").before(location.href);
});
});
<script src="//code.jquery.com/jquery-3.2.1.js"></script>
<button type="button" id="testbutton">Click me</button>
The window Object is a global Object and has many properties that you can read and edit , one of this properties is the location Object which is not a text its an object that holds some information about the current location and urls but you can access the current url location using location.href and then you can insert this text any place you want , look at the example below
$(function() {
$('#testbutton').click(function() {
var currentUrl = window.location.href;
$('#testbutton').before(currentUrl+'<br>');
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<button type="button" id="testbutton">Click me</button>
</body>
So I've been working recently on a script to obfuscate client-side code for protecting intellectual property without interfering with the appearance or interactivity of the resulting page. The process is as follows:
HTTP request comes in, .htaccess redirects (.*) to parse_request.php
parse_request.php creates a "phpURLParser" class whose class variables are essentially copies of the $_SERVER variables
phpURLParser looks at the requested path, and sometimes the host, referer, or other server-side information to determine how to react. There are several possible responses
a. The requested object was a .js or .css file. Pass the file to the YUI Compressor and send the output
b. The requested object is an image or application. Pass the file with no change
c. The requested object contains HTML. Replace every ASCII character with its 2-digit hexadecimal equivalent and send the following javascript:
<script type="text/javascript">
var x="~lots of hex~";
var y="";
for(i=0; i<x.length; i+=2){
y += unescape('%'+x.substr(i,2));
}
document.write(y);
</script>
So the website is replaced by a lot of hex and a small javascript to return the hex to its original form. I have an example of this setup at examples.chikachu.com/colorbox/example1 (I didn't code ColorBox, it's a free jQuery tool that I chose to use since it allowed me to test several different javascript features and make sure they all worked)
Now for the problem:
As it turns out, this works 99% of the time. But AJAX makes it angry. Clicking one of the AJAX examples (under "Other Content Types") will look like it redirects you to a new page. Looking in the address bar or viewing the page source will prove that you're still on the same page, however. Using the Inspect Element tool in Chrome (or Firebug in Firefox) will reveal that the contents of the webpage were entirely replaced by the contents of the AJAX request.
If I modify parse_request.php slightly to allow the file requested by the AJAX to be passed through unharmed, everything works. No problem. So for some reason my script which replaces the string of hex with its meaningful HTML counterpart is overwriting the entire website instead of nicely inserting itself within the confines of a <div> object.
Essentially here's the expected non-obfuscated HTML:
<html>
<head>
...
</head>
<body>
<div id="colorbox">
<INSERT AJAX HERE>
</div>
...
</body>
</html>
With only the AJAX obfuscated, I expect the following:
<html>
<head>
...
</head>
<body>
<div id="colorbox">
<script type="text/javascript">
var x="asdfasdfasdfasdf";
var y="";
for(i=0; i<x.length; i+=2){
y += unescape('%'+x.substr(i,2));
}
document.write(y);
</script>
</div>
...
</body>
</html>
I expect that the document.write() line here will write y at the location of the javascript (within the <div>). If I'm mistaken and that's not how document.write() works, I still expect it to write y at the end of the document. Instead, the entire document is replaced by y. Why is this, and what's my solution?
Answer to your last question:
Calling
document.write('my_precious_html_code');
will append or override text on page depending when it was called (before or after onLoad event). You shouldn't use it any script. Read more about it here: http://javascript.crockford.com/script.html
General answer:
Obfuscating HTML code doesn't make any sense. Just like protecting images by disabling right mouse button in late '90. It took me less then 3 sec to "crack" your obfuscated code and get beautifully formatted HTML. Also your site is rendered in quirks mode which is probably something you don't want.
Try something like this:
<html>
<head>
...
</head>
<body>
<div id="colorbox">
<div id="MYAJAXCONTENT">
</div>
<INSERT AJAX HERE>
</div>
...
</body>
</html>
<html>
<head>
...
</head>
<body>
<div id="colorbox">
<script type="text/javascript">
var x="asdfasdfasdfasdf";
var y="";
for(i=0; i<x.length; i+=2){
y += unescape('%'+x.substr(i,2));
}
document.getElementById('MYAJAXCONTENT').innerHTML = y;
// for the jQuery psychos out there
// $('#MYAJAXCONTENT').html(y);
</script>
</div>
...
</body>
</html>
I'm trying to write a web application using the new offline capabilities of HTML5. In this application, I'd like to be able to edit some HTML—a full document, not a fragment—in a <textarea>, press a button and then populate a new browser window (or <iframe>, haven't decided yet) with the HTML found in the <textarea>. The new content is not persisted anywhere except the local client, so setting the source on the window.open call or the src attribute on an <iframe> is not going to work.
I found the following question on StackOverflow: "Putting HTML from the current page into a new window", which got me part of the way there. It seems this technique works well with fragments, but I was unsuccessful in getting an entirely new HTML document loaded. The strange thing is when I view the DOM in Firebug, I see the new HTML—it just doesn't render.
Is it possible to render a generated HTML document in a new window or <iframe>?
EDIT: Here's a "working" example of how I'm attempting to accomplish this:
<!doctype html>
<html>
<head>
<title>Test new DOM</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
function runonload() {
return $("#newcode")[0].value;
}
$(function() {
$("#runit").click(function() {
w=window.open("");
$(w.document).ready(function() {
$(w.document).html(w.opener.runonload());
});
});
});
</script>
</head>
<body>
<textarea id="newcode">
<!doctype html>
<html>
<head>
<title>New Page Test</title>
</head>
<body>
<h1>Testing 1 2 3</h1>
</body>
</html>
</textarea>
<br/>
<button id="runit">Run it!</button>
</body>
</html>
I think you are overcomplicating this...
try this:
<SCRIPT LANGUAGE="JavaScript">
function displayHTML(form) {
var inf = form.htmlArea.value;
win = window.open(", ", 'popup', 'toolbar = no, status = no'); win.document.write("" + inf + ""); } // </script>
<form>
<textarea name="htmlArea" cols=60 rows=12> </textarea> <br> <input type="button" value=" Preview HTML (New Window)" onclick="displayHTML(this.form)"> </form>
$(w.document).html(w.opener.runonload());
You can't set innerHTML—or, consequently, jQuery's html()—on a Document object itself.
Even if you could, you wouldn't be able to do it using html(), because that parses the given markup in the context of an element (usually <div>) from the current document. The doctype declaration won't fit/work, putting <html>/<body>/etc inside a <div> is invalid, and trying to insert the elements it creates from the current ownerDocument into a different document should give a WRONG_DOCUMENT_ERR DOMException. (Some browsers let you get away with that bit though.)
This is a case where the old-school way is still the best:
w= window.open('', '_blank');
w.document.write($('#newcode').val());
w.document.close();
Whilst you can inject innerHTML into a pop-up's document.documentElement, if you do it that way you don't get the chance to set a <!DOCTYPE>, which means the page is stuck in nasty old Quirks Mode.