ワードプレスのesc_js関数の使用方法・解説

概要

esc_js 関数は、文字列をインラインJavaScript向けにエスケープ処理するために利用されるWordPressの関数です。主に、JavaScriptコードをHTMLの属性内に安全に挿入する際に使用されます。この関数は、悪意のあるスクリプトの注入を防ぎ、セキュリティを強化します。以下はesc_js関数がよく使われる場面の例です:

  1. カスタムJavaScriptコードの挿入
  2. ローカライズされたスクリプトでの文字列の追加
  3. AJAXリクエストのためのデータ準備
  4. ユーザー入力のエスケープ処理
  5. テーマやプラグインのオプション設定
  6. ブロックエディタでのスクリプトの追加
  7. ウィジェット内でのスクリプトの出力
  8. カスタムイベントリスナーの設定

構文

esc_js( $string );

パラメータ

  • $string (string): エスケープ処理を行う対象の文字列。

戻り値

  • エスケープ処理された文字列。

関連する関数

使用可能なワードプレスバージョン

esc_js関数は、WordPress 2.9 以降のバージョンで使用可能です。

コアファイルのパス

esc_js 関数は、wp-includes/functions.php ファイルに含まれています。

この関数のアクションでの使用可能性

アクション 使用例
mu_plugin_loaded
registered_post_type
plugins_loaded
wp_roles_init
setup_theme
after_setup_theme
set_current_user
init
register_sidebar
wp_loaded
send_headers
parse_query
pre_get_posts
wp
template_redirect
get_header
wp_head

非推奨または削除されたバージョン

esc_js関数は今のところ、特定のバージョンで非推奨または削除されていません。

サンプルコード

サンプルコード1: 基本的な使用例

<script>
    var string = "<?php echo esc_js( $my_string ); ?>";
</script>

このコードは、PHPで定義された文字列を安全にJavaScriptの変数に代入します。

サンプルコード2: AJAXリクエスト内での使用

jQuery.ajax({
    url: ajaxurl,
    data: {
        action: 'my_action',
        data: "<?php echo esc_js( $data ); ?>"
    }
});

このコードは、AJAXリクエストのデータとして文字列を追加する際に使用されます。

サンプルコード3: テーマのオプション設定

add_theme_support('custom-logo', array(
    'header-text' => esc_js( get_bloginfo('name') )
));

このコードは、カスタムロゴの設定でサイト名をエスケープ処理して利用しています。

サンプルコード4: HTML内にJavaScriptを挿入

<div onclick="alert('<?php echo esc_js( $alert_message ); ?>');">Click me</div>

このコードは、onclickイベントにエスケープされた文字列を使用します。

サンプルコード5: スクリプトのローカライズ

wp_localize_script('my-script', 'myData', array(
    'name' => esc_js( get_bloginfo('name') )
));

このコードは、WordPressのスクリプトにデータを渡す際に、サイト名をエスケープ処理しています。

この関数について質問する


上の計算式の答えを入力してください