Question

我有不同设计的不同页面的标题。我必须在标题部分添加所有css文件，这会增加页面加载。我的问题是，有没有办法动态加载css文件到标题部分。我正在使用codeigniter框架。

Answer 1

要在CodeIgniter中实现此功能，首先在config.php中设置默认的CSS和JavaScript文件

$config['header_css'] = array('style.css','prettyPhoto.css','nivo-slider.css');
$config['header_js']  = array('core.js','core.js',
                          'jquery-1.4.1.min.js',
                          'jquery-slidedeck.pack.lite.js',
                          'jquery-prettyPhoto.js',
                          'jquery.nivo.slider.js');

然后，将我编写的这个帮助函数添加到模板助手（或您使用的任何其他助手文件）

//Dynamically add Javascript files to header page
if(!function_exists('add_js')){
function add_js($file='')
{
    $str = '';
    $ci = &get_instance();
    $header_js  = $ci->config->item('header_js');

    if(empty($file)){
        return;
    }

    if(is_array($file)){
        if(!is_array($file) && count($file) <= 0){
            return;
        }
        foreach($file AS $item){
            $header_js[] = $item;
        }
        $ci->config->set_item('header_js',$header_js);
    }else{
        $str = $file;
        $header_js[] = $str;
        $ci->config->set_item('header_js',$header_js);
    }
}
}

//Dynamically add CSS files to header page
if(!function_exists('add_css')){
function add_css($file='')
{
    $str = '';
    $ci = &get_instance();
    $header_css = $ci->config->item('header_css');

    if(empty($file)){
        return;
    }

    if(is_array($file)){
        if(!is_array($file) && count($file) <= 0){
            return;
        }
        foreach($file AS $item){   
            $header_css[] = $item;
        }
        $ci->config->set_item('header_css',$header_css);
    }else{
        $str = $file;
        $header_css[] = $str;
        $ci->config->set_item('header_css',$header_css);
    }
}
}

if(!function_exists('put_headers')){
function put_headers()
{
    $str = '';
    $ci = &get_instance();
    $header_css = $ci->config->item('header_css');
    $header_js  = $ci->config->item('header_js');

    foreach($header_css AS $item){
        $str .= '<link rel="stylesheet" href="'.base_url().'css/'.$item.'" type="text/css" />'."\n";
    }

    foreach($header_js AS $item){
        $str .= '<script type="text/javascript" src="'.base_url().'js/'.$item.'"></script>'."\n";
    }

    return $str;
}
}

现在，您可以手动添加CSS和JavaScript文件，如下所示：

add_css(array('demo.css','demo1.css'));
add_js('demo.js');

在CodeIgniter Head部分中动态添加Javascript和CSS文件

1 个答案: