エクセル関数

キーワードからMicrosoftのExcelで使用できる関数をキーワード、または種別から検索できます。成績表家計簿シフト表の作成でお悩みの場合は「エクセル関数の活用例」をご覧ください。

エクセル関数の注意事項

  • 関数やバージョンによっては掲載していないことがあります。
  • エクセル関数などに関して当サイトは一切責任を負いません。
出張/持込/宅配でパソコン修理・設定 24時間365日対応

エクセル関数の検索機能について

エクセル関数の検索機能はJavaScriptで制作しています。掲載しているソースコードは解説のために改変や省略をしているので、実際のソースコードとは異なります。

使用しているJavaScriptのライブラリ

HTML

HTML
<div id="excel-function-search" class="excel-function-search">
    <p>お探しのエクセル関数についてのキーワードを入力してください。最大10件まで表示します。</p>
    <ul id="excel-function-search-tags" class="excel-function-search-tags">
        <li><a href="javascript:void(0);" data-label="絶対値">絶対値</a></li>
        <li><a href="javascript:void(0);" data-label="集計">集計</a></li>
        <li><a href="javascript:void(0);" data-label="平均">平均</a></li>
        <li><a href="javascript:void(0);" data-label="個数">個数</a></li>
        <li><a href="javascript:void(0);" data-label="検索">検索</a></li>
        <li><a href="javascript:void(0);" data-label="比較">比較</a></li>
        <li><a href="javascript:void(0);" data-label="四捨五入">四捨五入</a></li>
    </ul>
    <input type="text" id="search-keyword" placeholder="例)絶対値">

    <div class="btn-group-submit">
        <button id="submit">検索する</button>
    </div>
</div>

<div id="search-result" class="search-result">
    <div id="search-result-table"></div>
</div>

<div id="excel-function-list"></div>

エクセル関数一覧を用意

$.ajaxメソッドを使用して、JSONファイルからエクセル関数のデータを取得して定数に格納します。
※ブラウザによっては直接開くと文字化けします。

JavaScript
const EXCEL_FUNCTION_LIST = '../excel-function-list.json';
const LIST = getJsonData(EXCEL_FUNCTION_LIST);

function getJsonData(url) {
    return $.ajax({
        type: 'GET', 
        url: url,
        dataType: 'json',
        timeout: 5000
    });
}

エクセル関数一覧を表示

doneメソッドでエクセル関数一覧を取得できたら、HTMLを組み立ててemptyメソッドで一旦空にしてからappendメソッドで該当の個所に表示します。

JavaScript
LIST.done(data => {
    excelFunctionTable(data, false, '#excel-function-list');
});

function excelFunctionTable(data, showExample, output, limit) {
    let html = '';
    let i = 1;
    
    $.each(data, (key, val) => {
        if (i > limit) {
            return false;
        }
        
        if (showExample) {
            html += '<div class="search-result-box">';
        }
        
        html += '<h3>' + val.name + '</h3>';
        html += '<table class="bordered-table excel-function-table">';
        html += '<tr>';
        html += '<th>説明</th>';
        html += '<td>' + val.desc + '</td>';
        html += '</tr>';
        html += '<tr>';
        html += '<th>書式</th>';
        html += '<td>' + val.form + '</td>';
        html += '</tr>';
        html += '<tr>';
        html += '<th>引数</th>';
        html += '<td>';
        html += '<ol>';
        $.each(val.arg, (k, v) => {
            html += '<li>' + v + '</li>';
        });
        html += '</ol>';
        html += '</td>';
        html += '</tr>';
        html += '<tr>';
        html += '<th>引数の説明</th>';
        html += '<td>';
        html += '<ol>';
        $.each(val.arg_desc, (k, v) => {
            html += '<li>' + v + '</li>';
        });
        html += '</ol>';
        html += '</td>';
        html += '</tr>';
        html += '</table>';
        
        if (showExample) {
            html += '<div id="example-' + val.name.replace('.', '-') + '" class="search-result-example">';
            html += '<p>' + val.example_sup + '</p>';
            html += '<div id="example-inner-' + val.name.replace('.', '-') + '" class="search-result-example-inner"></div>';
            html += '</div>';
        }
        
        if (showExample) {
            html += '</div>';
        }
        
        i++;
    });
    
    $(output).empty().append(html);
}

エクセル関数の検索を実行

検索するボタンが押された時に、入力されているキーワードに合うエクセル関数を検索します。

JavaScript
$('#submit').on('click', () => {
    searchExcelFunction();
});

function searchExcelFunction() {
    LIST.done(data => {    
        let $keyword = $('#search-keyword').val();
        let $example = '';
        let $exampleInner = '';
        let result = [];

        if ($keyword !== '') {
            $.each(data, (key, val) => {
                $.each(val.tag, (k, v) => {
                    if (
                        (
                            v.toLowerCase().indexOf($keyword) !== -1
                            || v.toUpperCase().indexOf($keyword) !== -1
                        )
                        && result.indexOf(val) === -1
                    ) {
                        result.push(val);
                    }
                });
            });
        }
        
        $('#search-result').hide();

        if (result.length > 0) {
            $('#search-result').show();
            excelFunctionTable(result, true, '#search-result-table', 10);
            
            $.each(result, (key, val) => {
                $example = $('#example-' + val.name.replace('.', '-'));
                $exampleInner = $('#example-inner-' + val.name.replace('.', '-'));
                $('<h4>' + val.name + 'の例</h4>').prependTo($example);
                new Handsontable($exampleInner[0], {
                    data: val.example,
                    rowHeaders: true,
                    colHeaders: true
                });
            });
        }
    });
}

タグからキーワードを検索

エクセル関数一覧のデータに設定されているタグから、入力されたキーワードを検索します。$.each関数でタグを1つずつキーワードと比較して、該当するタグがあればそのタグを含むエクセル関数をpushメソッドを使用して変数に格納します。検索キーワードが大文字でも小文字でも引っかかるようにするために、toLowerCaseメソッドで小文字、toUpperCaseメソッドで大文字に変換します。

JavaScript
let $keyword = $('#search-keyword').val();
let result = [];

if ($keyword !== '') {
    $.each(data, (key, val) => {
        $.each(val.tag, (k, v) => {
            if (
                (
                    v.toLowerCase().indexOf($keyword) !== -1
                    || v.toUpperCase().indexOf($keyword) !== -1
                )
                && result.indexOf(val) === -1
            ) {
                result.push(val);
            }
        });
    });
}

該当するエクセル関数を表示

検索で引っかかったエクセル関数を表示します。検索結果にはそのエクセル関数の使用例を、Handsontableを使用して表示します。Handsontableを使用することで、Excelと同じように表示することができます。また、関数名をクラス名としても使用しているため、replaceメソッドを使用してFLOOR.MATHなどのドットをハイフンに変換します。

JavaScript
if (result.length > 0) {
    $('#search-result').show();
    excelFunctionTable(result, true, '#search-result-table', 10);

    $.each(result, (key, val) => {
        $example = $('#example-' + val.name.replace('.', '-'));
        $exampleInner = $('#example-inner-' + val.name.replace('.', '-'));
        $('<h4>' + val.name + 'の例</h4>').prependTo($example);
        new Handsontable($exampleInner[0], {
            data: val.example,
            rowHeaders: true,
            colHeaders: true
        });
    });
}

おわりに

今回はJSONファイルを使用していますが、やり方を少し変えればXLSXファイルやCSVファイルでも行うことができます。キーワードでの検索は手動で設定しているタグを使用しているので、入力されたキーワードが登録されていない場合は当然検索に引っかかりません。JSONファイルからJavaScriptでデータを検索したり表示する際は「javascript json」などで検索してみてください。

出張/持込/宅配でパソコン修理・設定 24時間365日対応
消費税計算

税率を設定して税込/税抜金額の消費税計算ができます。

文字数カウント

文字数をカウントできます。

和暦西暦変換

和暦と西暦を相互変換できます。

年齢計算

和暦または西暦から年齢を計算できます。

入学年・卒業年計算

履歴書に必要な学校の入学年・卒業年を生年月日から計算できます。

単位変換(換算)

キロ、マイル、グラム、華氏などの様々な単位を相互変換(換算)できます。

カラーコード変換

カラーコード(16進数)とRGB値(10進数)を相互変換できます。

Webタイマー(カウントダウン)

Webタイマー(カウントダウン)です。ストップウォッチ機能もあります。

電話番号一覧

警察や消防などの緊急連絡先や電話番号案内などの電話番号を確認できます。

タスク管理(ToDo)

自分のWebブラウザだけでタスク管理(ToDo)ができます。

エクセル関数

エクセル関数を検索できます。

麻雀の点数計算

麻雀の和了時の点数(符数/翻数/役)を計算することができます。

便利なショートカット一覧

Windows 10やExcelなどで使用できる便利なショートカットを確認できます。

電気料金計算

消費電力、使用時間、使用日数、1kWh単価から電気料金を計算できます。

パスワード生成(作成)

大文字・小文字・数字・記号を含むランダムなパスワードを生成できます。

出張/持込/宅配でパソコン修理・設定 24時間365日対応
きょうみくん
このサイトの管理者
名前 きょうみくん
身長 181.1cm
誕生日 1月21日
所属 日本PCサービス
コメント パソコン、インターネット、サーモン、ミルクティーが好きです。
猫ではありません。