cheerioの使い方――日本語を扱う

2016/08/21

1 日本語
2 サンプルコード1
3 関連

cheerioモジュールの基本的な使用方法に関しては下の記事を参照してください。

cheerioモジュール

Node.js

DOMを使用するには下のようなモジュールを利用する方法があります。 jsdom cheerio d3 この記事ではcheerioモジュールを利用する方法を取り上げます。 DOMの作成 DOMを作成するにはcheerio.load関数を使用します。 var cheerio = require('

日本語

cheerioモジュールで日本語を含むHTMLドキュメントを取り扱う際には注意しなければならない点があります。

それはcheerio.load関数を使用してDOMを作成する際に第2引数のdecodeEntitiesオプションをfalseに設定しなければHTML要素のHTMLの取得時にひらがな、カタカナ、漢字などが全てエスケープされてしまうということです。

たとえば、下のようなHTMLドキュメントからDOMを作成し、$.html関数を使用してそのままHTMLドキュメント全体のHTMLを取得すると下のようになります。

$.html関数とは？

Node.js

cheerioの使い方――HTML要素のHTMLを取得する

cheerioモジュールの基本的な使用方法に関しては下の記事を参照してください。 cheerioモジュールcheerioを使ってDOMを使用するDOMを使用するには下のようなモジュールを利用する方法があります。 jsdom cheerio d3 この記事ではcheerioモジュールを利用する方法を取り上げます。

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>タイトル</title>
        </head>
        <body>
                <p id="p1" class="odd">段落1</p>
                <p id="p2" class="even">段落2</p>
                <p id="p3" class="odd">段落3</p>
                <p id="p4" class="even">段落4</p>
                <p id="p5" class="odd">段落5</p>
        </body>
</html>

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>&#x30BF;&#x30A4;&#x30C8;&#x30EB;</title>
        </head>
        <body>
                <p id="p1" class="odd">&#x6BB5;&#x843D;1</p>
                <p id="p2" class="even">&#x6BB5;&#x843D;2</p>
                <p id="p3" class="odd">&#x6BB5;&#x843D;3</p>
                <p id="p4" class="even">&#x6BB5;&#x843D;4</p>
                <p id="p5" class="odd">&#x6BB5;&#x843D;5</p>
        </body>
</html>

漢字などが全てエスケープされていることが分かります。

これはdecodeEntitiesオプションのデフォルトがtrueであるためです。

decodeEntitiesオプションをfalseに設定するとエスケープされることはありません。

サンプルコード1

cheerio-decode-entities.js

var cheerio = require('cheerio');

var $ = cheerio.load(`
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>タイトル</title>
    </head>
    <body>
        <p id="p1" class="odd">段落1</p>
        <p id="p2" class="even">段落2</p>
        <p id="p3" class="odd">段落3</p>
        <p id="p4" class="even">段落4</p>
        <p id="p5" class="odd">段落5</p>
    </body>
</html>
`, {
    decodeEntities: false
});

console.log($.html());

使用パッケージ

cheerio
npm install cheerioでインストールします。

実行結果

C:\work\node>node cheerio-decode-entities.js

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>タイトル</title>
        </head>
        <body>
                <p id="p1" class="odd">段落1</p>
                <p id="p2" class="even">段落2</p>
                <p id="p3" class="odd">段落3</p>
                <p id="p4" class="even">段落4</p>
                <p id="p5" class="odd">段落5</p>
        </body>
</html>