html 试试秘银
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html 试试秘银相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>try mithril</title>
<style type="text/css" media="screen">
#header {
height: 80px;
width: 100%;
}
#header h1 {
margin: 0;
padding: 0;
font-size: 120%;
}
#editor {
position: absolute;
top: 80px;
bottom: 0;
left: 0;
width: 49%;
}
#result {
position: absolute;
top: 80px;
bottom: 0;
right: 0;
width: 50%;
height: 100%;
}
</style>
</head>
<body>
<div id="main">
<div id="header">
<h1>Try Mithril</h1>
<button id="run" title="Command-Enter">RUN (Command+Enter)</button>
</div>
<div id="editor">//namespace
var app = {};
//model
app.PageList = function() {
//return m.request({method: "GET", url: "pages.json"});
return m.prop([
{ title: "page 1", url: "http://example.com/1" },
{ title: "page 2", url: "http://example.com/2" },
{ title: "page 3", url: "http://example.com/3" },
]);
};
//controller
app.controller = function() {
var pages = app.PageList();
return {
pages: pages,
rotate: function() {
pages().push(pages().shift());
}
}
};
//view
app.view = function(ctrl) {
return [
ctrl.pages().map(function(page) {
return m("a", {href: page.url}, page.title);
}),
m("button", {onclick: ctrl.rotate}, "Rotate links")
];
};
//initialize
m.mount(document.getElementById("main"), app);
</div>
<iframe id="result" srcdoc='
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>try mithril</title>
</head>
<body>
<div id="main">
RESULT AREA
</div>
<script>
window.onerror = function(msg, file, line, column, err) {
parent.console.error(arguments);
}
</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"></script>
<div id="injectable"></div>
</body>
</html>
'></iframe>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/mithril/0.2.0/mithril.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/ace.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/ext-language_tools.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/theme-github.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/mode-javascript.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/snippets/javascript.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/ext-keybinding_menu.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ace/1.2.0/keybinding-vim.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var editor = ace.edit("editor");
editor.setTheme("ace/theme/github");
editor.setKeyboardHandler("ace/keyboard/vim");
editor.getSession().setMode("ace/mode/javascript");
editor.getSession().setTabSize(2);
editor.$blockScrolling = Infinity;
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true
});
function run() {
var code = editor.getValue();
var iframe = document.getElementById('result');
var doc = iframe.contentDocument
var oldScript = doc.getElementById('injectable');
var parentNode = oldScript.parentNode;
var newScript = doc.createElement('script');
newScript.setAttribute('id', 'injectable');
newScript.textContent = code;
parentNode.replaceChild(newScript, oldScript);
}
editor.commands.addCommand({
name: 'myCommand',
bindKey: {win: 'Ctrl-Enter', mac: 'Command-Enter'},
exec: function(editor) {
run();
},
readOnly: true
});
document.getElementById('run').addEventListener('click', run);
});
</script>
</body>
</html>
以上是关于html 试试秘银的主要内容，如果未能解决你的问题，请参考以下文章
html SafariDoS☠️（原始推文：https：//twitter.com/pwnsdx/status/1040944750973595649，试试看：https：//reaperbugs.c