wordpress引用js文件

案例：添加navigation.js文件，以及紧接该文件后添加一段内联js代码。

navigation.js目录结构如下

your-theme/
├── assets/
│   └── js/
│       └── navigation.js
└── functions.php

在 functions.php 文件中添加上述代码：

add_action( 'wp_enqueue_scripts', 'theme_slug_enqueue_scripts' );

function theme_slug_enqueue_scripts() {
    wp_enqueue_script( 
        'theme-slug-navigation',
        get_parent_theme_file_uri( 'assets/js/navigation.js' ),
        array(),
        wp_get_theme()->get( 'Version' ),
        true
    );

    wp_add_inline_script( 
        'theme-slug-navigation', 
        'console.log( "Testing" );'
    );
}

效果如下：

<!DOCTYPE html>
<html lang="en">

<head>
    <!-- 其他头部内容 -->
</head>

<body>
    <!-- 页面主体内容 -->
    <!-- 如果前面设置了加载到页脚，脚本会出现在这里 -->
    <script src="https://your-site.com/wp-content/themes/your-theme/assets/js/navigation.js?v=1.0"></script>
    <script>
        console.log( "Testing" );
    </script>
</body>

</html>

♦ 标题2

◆ 标题3

段落