Functions.phpにJavascriptを正しく追加する方法

 plugins_url( '/removeArrows.js' , __FILE__ )
 

もう1つの注意点として、スクリプトとスタイルを最後にロードすることをお勧めします.これにより、他のスクリプトやスタイルによって上書きされないようになります.これを行うには、$priority)に非常に低い優先度(非常に高い数値)を追加するだけです. rel="noreferrer"> add_action .

  add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 
 

そして常に wp_enqueue_scripts アクションフック.これは、使用するのに適切なフックです. スクリプトとスタイルをwp_headまたはwp_footer

編集

テーマの場合、すべてをテーマに移動したことを示したので、wp_register_script()はこれに変更されます

  get_template_directory_uri() . '/removeArrows.js'
 

親テーマとこれについて

 get_stylesheet_directory_uri() . '/removeArrows.js'
 

子テーマの場合.完全なコードは次のようになります

 function wpb_adding_scripts() {
    wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', array('jquery'),'1.1', true);
    wp_enqueue_script('my_amazing_script');
} 

add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 
 

Your $scr in your wp_register_script() function is wrong. Given that your functions.php is inside your plugin, and your removeArrows.js is in the root of your plugin, your $scr should look like this

plugins_url( '/removeArrows.js' , __FILE__ )

Another point of note, it is always good practice to load your scripts and styles last. This will ensure that it will not get overriden by other scripts and styles. To do this, just add a very low priority (very high number) to your priority parameter ($priority) of add_action.

 add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 

And always load/enqueue scripts and styles via the wp_enqueue_scripts action hook, as this is the proper hook to use. Do not load scripts and styles directly to wp_head or wp_footer

EDIT

For themes, as you've indicated that you now moved everything to your theme, your $scr would change to this

 get_template_directory_uri() . '/removeArrows.js'

for parent themes and this

get_stylesheet_directory_uri() . '/removeArrows.js'

for child themes. Your complete code should look like this

function wpb_adding_scripts() {
    wp_register_script('my_amazing_script', get_template_directory_uri() . '/removeArrows.js', array('jquery'),'1.1', true);
    wp_enqueue_script('my_amazing_script');
} 

add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts', 999 ); 

別の外部jsファイルを追加することはありません.これは、フェッチするための余分で不要なリソースであり、ページの読み込み時間の観点から削減したいものです.

wp_headフックを使用して、このjQueryスニペットをWebサイトのヘッドに追加します.テーマまたはプラグインの関数ファイルに以下を貼り付けます.また、以下に示すように、jQueryが競合なしモードになっていることを確認しました.

 add_action('wp_head','woocommerce_js');

function woocommerce_js()
{ // break out of php ?>

jQuery(document).ready(function($) {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
<?php } // break back into php
 

これを実行してページを更新したら、ページソースをチェックして、このjQueryスニペットが実際にページに読み込まれていることを確認します.そうであれば、使用している実際のjQueryスニペットで何かがずれていない限り、機能するはずです.

I would not add another external js file, its just an extra and unnecessary resource to fetch and that is something we want to cut down on in terms of page loading times.

I would add this jQuery snippet in your websites head using the wp_head hook. You would paste the following in your theme or plugins functions file. I have also made sure jQuery is in no-conflict mode as you can see below.

add_action('wp_head','woocommerce_js');

function woocommerce_js()
{ // break out of php ?>

jQuery(document).ready(function($) {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
<?php } // break back into php

Once you have done this and refreshed your page, check the page source to make sure this jQuery snippet is in fact being loaded into your page. If it is then it should work unless their is something off in the actual jQuery snippet you are using.

答えはすでに受け入れられているので、私が何度も行ったフッターにJavaScriptコードをキューに入れる別の方法があると言いたいだけです.

Functions.phpファイル内:

 function load_script_to_remove_arrow(){
?>
<script>
$(document).ready(function() {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
</script>
<?php
}
add_action( 'wp_footer', 'load_script_to_remove_arrow' );
 

条件を使用することによってのみ、このスクリプトを特定のページテンプレートにロードできます

 if( is_page_template( 'page-template.php' ) ):

//put above code (or just add_action part) inside this condition to load file only if the condition is true 

endif;
 

page-template.phpがディレクトリ(テーマのルートディレクトリにあるtemplatesディレクトリなど)にある場合は、次のように記述できます.

 is_page_template( 'templates/page-template.php' );
 

As the answer is accepted already so, I just want to say there's another way to enqueue javascript code in footer which I have done many times.

in functions.php file:

function load_script_to_remove_arrow(){
?>
<script>
$(document).ready(function() {
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace(" →", "");
    });
    $(".woocommerce-cart").html(function(i, val) {
    return val.replace("← ", "");
    });
});
</script>
<?php
}
add_action( 'wp_footer', 'load_script_to_remove_arrow' );

you can load this script to particular page template only by using condition

if( is_page_template( 'page-template.php' ) ):

//put above code (or just add_action part) inside this condition to load file only if the condition is true 

endif;

if the page-template.php is in directory ( say templates directory in your theme's root dir ) you can write like:

is_page_template( 'templates/page-template.php' );

質問に答えるには、最初にjavascriptとJQueryを区別する必要があります.

簡単に説明するには:

• JavascriptはECMAScriptに基づいています
• JQueryはJavascript用のライブラリです

実際には、2つの異なる質問をします.

• あなたのタイトルは、JavaScriptを実装するためのソリューションについて語っています
• あなたの質問は、JQueryを実装するためのソリューションについて語っています

Googleの結果にはタイトルが表示され、ページのすべてのコンテンツがJQueryについて説明しているため、JavaScriptソリューションを検索する人々にとってこれは非常に苛立たしいものになる可能性があります.

そして今、JQueryソリューションについて:

 wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);
 

そしてjavascriptソリューション:

 wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array(), '1.0.0', true );
 

このコードはfunctions.phpに追加できます どちらの場合も、スクリプトの場所はwp-content/themes/theme-name/js/script.js

ハッピーコーディング！

To answer the question we must first make a distinction between javascript and JQuery.

To state it in a simple fashion:

• Javascript is based on ECMAScript
• JQuery is a library for Javascript

So in reality you ask two different questions:

• Your title speaks about a solution for implementing javascript
• Your question speaks about a solution for implementing JQuery

Because the Google results show your title and all the content of the page talks about JQuery this can become very frustrating to people that search for a javascript solution.

And now for the JQuery solution:

wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array ( 'jquery' ), 1.1, true);

And the javascript solution:

wp_enqueue_script( 'script-id', get_template_directory_uri() . '/js/script.js', array(), '1.0.0', true );

This code can be added to your functions.php The location of the scripts in both cases is wp-content/themes/theme-name/js/script.js

Happy coding!