Home > Developer > JavaScript
See some HTML code in the Web page and wonder what this code looks like?
Think some template code good also want to manually copy, new file, paste too troublesome?
The following JS method can help you solve these problems.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
< title > JavaScript runs HTML code online and saves the HTML code to local < / Title >
</head>
<body>
<textarea id="code" style="width: 830px;height: 480px">
<!DOCTYPE html>
< html>
< head>
<title>Document</title>
<style type="text/css">
*{margin: 0;padding: 0;}
div{margin: 50px auto;width: 120px;height: 120px;border: 10px solid #f08;background: #ccc;text-align: center;}
span{font: 14px/100px "Consolas";color: #333;}
</style>
</head>
< body>
<div><span>run&save Code</span></div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</html>
<script>
function runCode(code) {
var newWindow = window.open(‘‘, ‘‘, ‘‘);
newWindow.opener = null;
newWindow.document.write(code);
newWindow.document.close();
}
function saveCode(code, filename) {
filename = filename || ‘saveCode‘;
if (/trident/i.test(navigator.userAgent)) {
var newwin = window.open(‘‘, ‘_blank‘, ‘top=10000‘);
newwin.document.open(‘text/html‘, ‘replace‘);
newwin.document.write(code);
newwin.document.execCommand(‘saveas‘, ‘‘, filename + ‘.html‘);
newwin.close();
} else {
/ /...
}
}
function blobSaveCode(code, filename) {
var urlObject = window.URL || window.webkitURL || window,
exportBlob = new Blob([code]),
saveLink = document.createElementNS(‘http://www.w3.org/1999/xhtml‘, ‘a‘),
e = document.createEvent(‘MouseEvents‘);
/ /...
}
</script>
</textarea>
<br>
< button onclick = "runcode (document. Getelementbyid ('code '. Value)" > run code < / button >
< button onclick = "save code (document. Getelementbyid ('code '). Value,' Save '" > save code < / button >
< button onclick = "blobsavecode (document. Getelementbyid ('code '). Value,' blobsave '") > save codeblob < / button >
<script>
//Run code online
function runCode(code) {
var newWindow = window.open(‘‘, ‘‘, ‘‘);
newWindow.opener = null;
newWindow.document.write(code);
newWindow.document.close();
}
* *
*Save code online
*@ remark uses blob object to generate a downloaded file. Browsers under ie10 are not supported
*The code after @ remark is saved locally is basically the same as the original code
* /
function blobSaveCode(code, filename) {
var urlObject = window.URL || window.webkitURL || window,
exportBlob = new Blob([code]),
saveLink = document.createElementNS(‘http://www.w3.org/1999/xhtml‘, ‘a‘),
e = document.createEvent(‘MouseEvents‘);
filename = filename || ‘blobsaveCode‘;
saveLink.href = urlObject.createObjectURL(exportBlob);
saveLink.download = filename + ‘.html‘;
e.initMouseEvent(
‘click‘, true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null
);
saveLink.dispatchEvent(e);
}
* *
*Save code online
*@ remark compatible with all browsers
*After @ remark is saved locally, the code will be confused, and some JS may not run
* /
function saveCode(code, filename) {
filename = filename || ‘saveCode‘;
if (/trident/i.test(navigator.userAgent)) {
var newwin = window.open(‘‘, ‘_blank‘, ‘top=10000‘);
newwin.document.open(‘text/html‘, ‘replace‘);
newwin.document.write(code);
newwin.document.execCommand(‘saveas‘, ‘‘, filename + ‘.html‘);
newwin.close();
} else {
var a = document.createElement(‘a‘);
document.body.appendChild(a);
a.href = ‘data:text/htm;charset=utf-8,‘ + code;
a.download = filename + ‘.html‘;
A.click ();
document.body.removeChild(a);
}
}
</script>
</body>
</html>
JavaScript runs HTML code online, saving HTML code to local
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
