DOM HTML PARSING

0

Source.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>

Теперь мне нужно руководство для, мне нужна кнопка Parse от parser.html, чтобы применить функции для source.html и сохранить как output.html в том же пути source.html...

Пожалуйста, помогите мне...

  • 0
    Для работы с файловой системой вам потребуется использовать язык сервера, что-то вроде PHP. Ваши функции javascript не будут хорошо работать с этим, я думаю, что FileSystem API ограничен. Вы хотите посмотреть на PHP и AJAX
  • 0
    Это не о разборе вообще. Парсинг - это то, что браузер делает для построения дерева DOM. Таким образом, когда вы манипулируете DOM, документ уже должен быть проанализирован.
Теги:
dom

2 ответа

0

Я согласен с предыдущим ответом, это довольно странный способ сделать.

Но, разбор 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>
  • 0
    Он выводит пустую страницу. Найдите здесь tool.setinfotec.com/parser.html
  • 0
    Вы действительно ожидаете, что это сработает, когда вы копируете / вставляете приведенный выше код в тег стиля? (Я проверил ваш пример в Chrome Inspector)
0

То, что сказал Уиллшоу, верно. У Javascript нет такой силы, чтобы решить вашу проблему. Вам нужно пойти на некоторые серверные скрипты.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню