Синтаксический анализатор JavaScript для DOM

у нас есть специальное требование в проекте, где мы должны проанализировать строку HTML (из ответа AJAX) на стороне клиента только через JavaScript. Вот так!--6-->нет разбора в PHP или Java! Я проходил через StackOverflow всю эту неделю и еще не получил приемлемого решения.

некоторые дополнительные сведения о требованиях:

  • мы можем использовать любую библиотеку (предпочтительно dojo и / или jQuery) или перейти родной!

  • нам нужно разобрать весь HTML-документ, который мы получаем в виде строки, включая <head> и <body>.

  • нам также нужно сериализовать проанализированные структуры DOM в строки время от времени.

  • наконец, мы не хотим добавлять проанализированный DOM к текущему документу. скорее, мы отправим его обратно на сервер для постоянного место хранения.

например: нам нужно что-то вроде 

var dom = HTMLtoDOM('<html><head><title> This is the old title. </title></head></html>');
    dom.getElementsByTagName('title')[0].innerHTML = "This is a new Title";

С моим исследованием, это наши варианты:

  1. A Парсер TinyMCE. Проблема? Мы должны обязательно включить редактора, я думаю. Как насчет разбора HTML, где нам не нужен редактор?

  2. парсер Джона Ресига. Это должно быть нашим лучшим выбором. К сожалению, синтаксический анализатор сбой, когда все содержимое a страница дана ему!

  3. jQuery $(htmlString) или dojo.toDom (htmlString). Оба полагаются на DocumentFragment и, следовательно, сожрав <head> и <body>!

редактировать: мы хотим сериализовать HTML, чтобы мы могли поймать определенные пользовательские HTML-Коммнеты через RegExp. Нам нужно дать пользователям возможность редактировать мета-теги, теги заголовков и т. д., Следовательно, парсер HTML.

О, и я чувствую, что меня убьют в Переполнение стека, даже если я просто подсказка при разборе HTML через RegExp!!!

6
dojo html-parsing javascript jquery parsing

5 ответов

вы можете использовать текущий документ без добавления к нему каких-либо узлов.

попробуйте что-то вроде этого:

function toNode(html) {
    var doc = document.createElement('html');
    doc.innerHTML = html;
    return doc;
}

var node = toNode('<html><head><title> This is the old title. </title></head></html>');

console.log(node);​

http://jsfiddle.net/6SvqA/3/

10

Я бы предложил решение из 2 частей, в котором Вы читаете теги, которые jQuery не будет анализировать для вас, а затем передать оставшуюся часть в jQuery. Если вы ищете чисто-javascript решение для анализа структуры данных HTML, jQuery, вероятно, ваш лучший выбор, поскольку он имеет много встроенных функций для управления данными. Вы действительно можете создать свой плагин как плагин jQuery, который можно вызвать через:$.парсер или что-то в этом роде. Если вы продлить jQuery с собственную функцию для разбора данные, вы также можете вернуть расширенный объект jQuery, который содержит функции для чтения определенных элементов данных даже из заголовка, так как вы можете вручную проанализировать ... информация и хранить ее в одном объекте.

1

поскольку HTML по существу является XML, вы можете использовать jQuery parseXML

var dom = $.parseXML(html);

$('title', dom).text("This is a new Title");

Edit:

Если вы хотите вернуть его в строку, вам нужно будет использовать плагин xml, но я не могу найти его исходный источник, поэтому вот он:

/**
 * jQuery xml plugin
 * Converts XML node(s) to string 
 *
 * Copyright (c) 2009 Radim Svoboda
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 * @author  Radim Svoboda, user Zzzzzz
 * @version 1.0.0
 */


/**
 * Converts XML node(s) to string using web-browser features.
 * Similar to .html() with HTML nodes 
 * This method is READ-ONLY.
 *  
 * @param all set to TRUE (1,"all",etc.) process all elements,
 * otherwise process content of the first matched element 
 *  
 * @return string obtained from XML node(s)  
 */         
jQuery.fn.xml = function(all) {

  //result to return
  var s = "";

   //Anything to process ?
   if( this.length )

    //"object" with nodes to convert to string  
   (
      ( ( typeof all != 'undefined' ) && all ) ?
      //all the nodes 
      this 
      :
      //content of the first matched element 
      jQuery(this[0]).contents()
    )
   //convert node(s) to string  
   .each(function(){
    s += window.ActiveXObject ?//==  IE browser ?
       //for IE
         this.xml
         :
         //for other browsers
         (new XMLSerializer()).serializeToString(this)
         ;
  }); 


  return    s;      

  };
1

Я не знаю, зачем кому-то это нужно, но я предлагаю вам просто сбросить свой источник в iframe. Браузер может сделать синтаксический анализ для вас. Вы даже можете запускать запросы DOM на результат.

0

Если вы хотите полный парсер, который не полагается на какую-то существующую вещь в браузере для загрузки вашего интерпретатора, парсер HTML в dom.js-высший класс. Вся цель состоит в том, чтобы проанализировать html для использования в JavaScript, размещенном DOM, поэтому он должен удовлетворять как спецификациям DOM, так и необходимости анализировать и использовать результаты в js, не предполагая никаких существующих инструментов, кроме базового JS. Он работает в узле.js или jsshell spidermonkey или даже веб-рабочие. https://github.com/andreasgal/dom.js

Он также имеет часть сериализации, но для этого вам нужно будет зафиксировать использование больше, чем просто часть синтаксического анализатора. Вы можете найти автономные сериализаторы, хотя они работают с любой структурой DOM.

0