个人中心
gpt4 book ai didi

javascript - 为什么我无法加载 CSS 文件和 JavaScript 文件？

转载 作者：行者123 更新时间：2023-11-28 04:13:54 24 4
gpt4 key购买 nike

我是开发网站的新手。有人会帮我解决这些问题吗？该文件的目录是正确的，但不知道为什么我仍然收到错误。 Wordpress 无法加载 CSS 文件以及 JavaScript。我已经使用了两种技术，但仍然无法工作，如下所示:任何人都可以教我为什么我使用这些技术无法加载 CSS 文件和 Javascript 文件。

我使用的第一个技术是 <?php echo get_template_directory_uri();?> and <?php bloginfo('template_directory');?>

标题.php

  <html lang="en">
    <head>
        <title>Untitled</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta name="description" content="" />
        <meta name="keywords" content="" />
        <!--[if lte IE 8]><link rel="stylesheet" href="<?php bloginfo('template_directory');?>/css/ie/v8.css" /><![endif]-->
        <script>
            var template_dir_js = "<?php echo get_template_directory_uri();?>";
        </script>
            <!--[if lte IE 8]><script src="<?php bloginfo('template_directory');?>/css/ie/html5shiv.js"></script><![endif]-->
            <script src="<?php echo get_template_directory_uri(); ?>/js/jquery.min.js" type="text/javascript"></script>
            <script src="<?php echo get_template_directory_uri(); ?>/js/jquery.dropotron.min.js" type="text/javascript"></script>
            <script src="<?php echo get_template_directory_uri(); ?>/js/skel.min.js" type="text/javascript"></script>
            <script src="<?php echo get_template_directory_uri(); ?>/js/skel-layers.min.js" type="text/javascript"></script>
            <script src="<?php echo get_template_directory_uri(); ?>/js/init.js" type="text/javascript"></script>
            <!--[if lte IE 8]><link rel="stylesheet" href="<?php bloginfo('template_directory');?>/css/ie/v8.css" /><![endif]-->    
            <meta charset="utf-8">
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/style.css" />
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/style-desktop.css" />
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/style-mobile.css" />
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/font-awesome.min.css" />
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/style-1000px.css" />
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory');?>/css/skel.css" />

    </head>

我使用的第二种技术是 wp_enqueue_script 和 wp_enqueue_style

标题.php

<html lang="en">
<head>
    <title>Untitled</title>
    <?wp_head();?>
</head>

页脚.php

    ...
<?php wp_footer();?>
    </body>
</html>

函数.php

<?php

function wpt_theme_styles() {   
wp_enqueue_style('abs',get_template_directory_uri().'/css/font-awesome.min.css',array(),'1.0.0','all'); 
wp_enqueue_style('foundation_css', get_template_directory_uri().'/css/style.css',array(),'1.0.0','all'); 
wp_enqueue_style('normali_css', get_template_directory_uri().'/css/style-1000px.css',array(),'1.0.0','all');
wp_enqueue_style('normalze1_css', get_template_directory_uri().'/css/style-mobile.css',array(),'1.0.0','all');
wp_enqueue_style('normalze_css', get_template_directory_uri().'/css/style-desktop.css',array(),'1.0.0','all');
wp_enqueue_style('main_css', get_template_directory_uri().'/css/skel.css',array(),'1.0.0','all'); 
wp_enqueue_script( 'modernizr_js', get_template_directory_uri().'/js/jquery.min.js', array(), '1.0.0', true ); 
wp_enqueue_script( 'foundation_js', get_template_directory_uri().'/js/jquery.dropotron.min.js', array(), '1.0.0', true ); 
wp_enqueue_script( 'init_js', get_template_directory_uri().'/js/skel.min.js', array(),'1.0.0', true );
wp_enqueue_script( 'init1_js', get_template_directory_uri().'/js/skel-layers.min.js', array(), '1.0.0', true ); 
wp_enqueue_script( 'init2_js', get_template_directory_uri().'/js/init.js', array(), '1.0.0', true );    

wp_enqueue_style('abs');
wp_enqueue_style('foundation_css');
wp_enqueue_style('normali_css');
wp_enqueue_style('foundation_css');
wp_enqueue_style('foundation_css');
wp_enqueue_style('foundation_css');
wp_enqueue_script('modernizr_js');
wp_enqueue_script('foundation_js');
wp_enqueue_script('normalze1_css');
wp_enqueue_script('normalze_css');
wp_enqueue_script('main_css');
}
add_action('wp_enqueue_scripts', 'wpt_theme_styles'); 
?>

error File Directory

当我查看源代码时

<script src="http://localhost/wordpress/wp-content/themes/momentum/js/jquery.min.js" type="text/javascript"></script>
        <script src="http://localhost/wordpress/wp-content/themes/momentum/js/jquery.dropotron.min.js" type="text/javascript"></script>
        <script src="http://localhost/wordpress/wp-content/themes/momentum/js/skel.min.js" type="text/javascript"></script>
        <script src="http://localhost/wordpress/wp-content/themes/momentum/js/skel-layers.min.js" type="text/javascript"></script>
        <script src="http://localhost/wordpress/wp-content/themes/momentum/js/init.js" type="text/javascript"></script>
        <!--[if lte IE 8]><link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/momentum/css/ie/v8.css" /><![endif]-->  
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/style.css" />
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/style-desktop.css" />
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/style-mobile.css" />
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/font-awesome.min.css" />
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/style-1000px.css" />
        <link rel="stylesheet" type="text/css" href="http://localhost/wordpress/wp-content/themes/momentum/css/skel.css" />

这意味着 URL 是正确的

最佳答案

我使用以下配置:

标题.php

<!DOCTYPE html>
<html lang="en">
<head>
...
...
...
<link href="<?php echo get_bloginfo('template_url'); ?>/css/mycss.css" rel="stylesheet">
<script src="<?php echo get_bloginfo('template_url'); ?>/js/myjs.js"></script>
...
...
<?php
/* Always have wp_head() just before the closing </head>
 * tag of your theme, or you will break many plugins, which
 * generally use this hook to add elements to <head> such
 * as styles, scripts, and meta tags.
 */
wp_head();
?>
</head>
<div class="myheader">
...
...
</div>

index.php(或 page.php、single.php 等...)

<?php get_header(); ?>
<div class="mycontainer">
....
....
....
</div>
<?php get_footer(); ?>

页脚.php

<div class="myfooter">
...
...
...
</div>
<?php
    /* Always have wp_footer() just before the closing </body>
     * tag of your theme, or you will break many plugins, which
     * generally use this hook to reference JavaScript files.
     */

    wp_footer();
?>
</body>
</html>

我没有使用 functions.php 中的任何内容来执行此操作，只是在所需的文件中

关于javascript - 为什么我无法加载 CSS 文件和 JavaScript 文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42570402/

24 4 0
文章推荐： php - 文件版本控制以消除浏览器缓存问题
文章推荐： javascript - 通过 jsonp api 调用返回 json 对象
文章推荐： javascript - 词云弹出视频
文章推荐： javascript - 使用javascript验证注册表单
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com