DOM HTML解析
Source.HTMLDOM HTML解析
<!DOCTYPE html>
<html>
<body>
<h1 style="color:red">Hello World</h1>
<p id="demo" style="color:red">Click the button below to remove the style attribute from the header above.</p>
</body>
</html>
Parser.html
<!DOCTYPE html>
<html>
<body>
<button onclick="myFunction()">Parse</button>
<script>
function myFunction()
{
document.getElementsByTagName("H1")[0].removeAttribute("style");
document.getElementsByTagName("P")[0].removeAttribute("style");
};
</script>
</body>
</html>
现在我需要的是引导,我需要从解析器解析按钮。 html将source.html的功能应用到output.html并保存在source.html的相同路径中...
请帮助我...
Willshaw说的是正确的。 Javascript没有那么大的能力来解决你的问题。你需要去做一些服务器端的脚本。
我同意上一个答案,这是一个很奇怪的方法。
但是,DOM解析对于javascript来说非常简单,我可以在客户端进行解析,然后将处理后的html发送到后端,并将其保存在result.html中。
我将使用Jquery为例,方式更简单。
Parser.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>load demo</title>
<style>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<button id="btnLoad">Load Source</button>
<button id="btnParse">Parse</button>
<button id="btnSave">Save</button>
<div style="display:none" id="sourceContainer"></div>
<script>
$(document).ready(function() {
$(".btnLoad").click(function(){$("#sourceContainer").load("/source.html");})
$(".btnParse").click(function(){
$(".sourceContainer h1").removeAttr("style");
$(".sourceContainer p").removeAttr("style");
})
$(".btnSave").click(function(){
var data = {
html: $("#sourceContainer").html()
};
//replace first param by the backend url, add callback function
$.post("http://...", data, ...);
})
});
</script>
</body>
</html>
它输出空白页.. 这里找到http://tool.setinfotec.com/parser.html –
当你将上面的代码复制/粘贴到样式标签中时,你真的希望它能够工作吗? (我检查了你的例子在铬检查员) – Yoann
你需要使用服务器端语言,像PHP,与文件系统的工作。 您的JavaScript函数不适用于此,我认为FileSystem API是有限的。你想看看PHP和AJAX –
这不是关于解析。解析是浏览器为构建DOM树所做的工作。因此,当您操作DOM时,文档必须已经被解析。 –