1. ホーム
  2. javascript

[解決済み] DOMParserをnode jsで使ってみる

2022-02-05 12:58:57

質問

私のjsコードでDOMParserを使用しようとすると問題が発生します。 私のコードでは、xmlhttp.responseTextソープレスポンスでxmlファイルを取得しています。 私はJSON形式でその要素にアクセスできるようにしたいので、私のコードは次のようになります。

var xml = new DOMParser();
xml = xml.parseFromString(xmlhttp.responseText, 'text/xml');
var result = xmlToJson(xml);

このようなエラーメッセージが表示されます。 ReferenceError: DOMParser is not defined

編集する このリンクは、私のjavascriptがnode.jsファイルであるため、HTMLページ内にないため、私には機能しませんでした。 JavaScript DOMParserのアクセスinnerHTMLと他のプロパティ

どのように解決するのですか?

DOM操作やXHRのような多くのブラウザの機能は、NodeJSネイティブでは利用できません。これは、DOMにアクセスするための典型的なサーバータスクではないからです。

DOMの容量はライブラリに大きく依存します。ここでは、使用できる主なツールの簡単な比較をしています。

  • jsdom : DOM レベル 4 を実装しています。 最新のDOM規格 そのため、最新のブラウザでできることは、すべて jsdom . これは、Node上でブラウザを操作するための事実上の業界標準であり、Mocha、Vue Test Utils、Webpack Prerender SPA Plugin、およびその他多くのプラグインで使用されています。

    const jsdom = require("jsdom");
    const dom = new jsdom.JSDOM(`<!DOCTYPE html><p>Hello world</p>`);
    dom.window.document.querySelector("p").textContent; // 'Hello world'
    
    
  • htmlparser2 同じですが、より複雑な API を使用する代わりに、性能と柔軟性が強化されています。

    const htmlparser = require("htmlparser2");
    const parser = new htmlparser.Parser({
      onopentag: (name, attrib) => {
        if (name=='p') console.log('a paragraph element is opening');
      }
    }, {decodeEntities: true});
    parser.write(`<!DOCTYPE html><p>Hello world</p>`);
    parser.end();
    // console output: 'a paragraph element is opening'
    
    
  • cheerio による HTML DOM 解析に基づく jQuery の実装です。 htmlparser2 :

    const cheerio = require('cheerio');
    const $ = cheerio.load(`<!DOCTYPE html><p>Hello world</p>`);
    $('p').text('Bye moon');
    $.html(); // '<!DOCTYPE html><p>Bye moon</p>'
    
    
  • xmldom : DOM レベル 2 を完全に実装し、DOM レベル 3 を部分的に実装しています。HTML と XML で動作する。

  • dom-parser のようないくつかの DOM メソッドを実装した、正規表現に基づいた DOM パーサーです。 getElementById . 正規表現でHTMLを解析するのは は非常に悪い考えです。 これは本番ではお勧めしません。