Dynamically include JavaScript from external file - PHP

Question

Thanks in advance for your help. I am having a hard time keeping my codebase clean. I want to avoid intermixing PHP, HTML, and CSS.

Currently, my main site is broken down into numerous smaller tabs. The PHP code for these tabs is dynamically included after an ajax call is made.

elseif (file_exists('templates/custom/'.$center."/".$section."/".$tab.".php")) {
 include 'templates/custom/'.$center."/".$section."/".$tab.".php";
 }

It works great but I would also like to dynamically include JavaScript from an external file. In my mind it would work like this,

elseif (file_exists('templates/custom/'.$center."/".$section."/".$tab.".php")) {
 include 'templates/custom/'.$center."/".$section."/".$tab.".php";
 include 'templates/custom/'.$center."/".$section."/".$tab.".js";
 }

How can I dynamically include javascript based on what tab the user wants to go to while still keeping the javascript separated by tab in individual files.

I have spent the entire day looking into this issue and keep coming across examples that look like this,

echo "<script language='javascript' type='text/javascript'>";
echo "alert('hello worldio');";
echo "</script>";
$URL="page.php";
echo "<script>location.href='$URL'</script>";

This site is a single page application. THanks again!

Answer 1

Javascript files cannot be included by php function. Use the below code

elseif (file_exists('templates/custom/'.$center."/".$section."/".$tab.".php")) {
 include 'templates/custom/'.$center."/".$section."/".$tab.".php"; 
 $file_path = "javascript external file path"; // replace with correct file path
?>
 <script language="JavaScript" type="text/javascript" src="<?php echo $file_path;?>"></script>
 <?php } ?>

Answer 2

只需print <script>标记以包括它：

 print '<script src="templates/custom/'.$center.'/'.$section.'/'.$tab.'.js'" type="text/javascript"></script>';

Answer 3

hi in my case i use module base template that seprated to smaller parts.i have 3 main UI part in my site 1.public site js for all templates jquery,bootstrap ,... that use in all templates must put here 2.each style or template has a js folder that all public js file of this templates must be there 3.each module in template has js folder that js special for that module must be there i do it for css too.in fact when i load a module check all of this folders by

array_slice(scandir($st_css_style_public_path), 2)

and create css link or js script and print final string of addresses in my page. but some times you need to inject a peace of code directly into your page i use a folder and a file with name of plugins->plugins.php put all piece of script there get it's content and print it into my page

`$st_plugins .= (file_exists($st_plugin_style_public_path) ) ? file_get_contents($st_plugin_style_public_path) : ' ';

all of my render method in my view is this :

public function render($address, $data = '', $cache = 1, $showstyle = 1) {
        $data['LINKPREFIX'] = '/' . $this->current_holding_unique_name
                . '/'
                . $this->current_lang;
        if (isset($address)) {
            $path = explode('/', $address);
            $path[0] = $path[0];
            $path[1] = $path[1];
        }
        $template = $this->twig->loadTemplate($path[0] . DS . $path[1] . '.twig');
        if ($showstyle) {
            $css_links = '';
            $js_links = '';
            $st_plugins = '';

            //##################################################
            //########################## CREATING CSS,JS ADDRESS
            //@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
            //####### SITE PUBLIC CSS & JS FILES
            $st_js_public_path = '.' . DS . PUBLIC_DIR . DS . $this->set_address($path[0]) . 'js';
            $st_css_public_path = '.' . DS . PUBLIC_DIR . DS . $this->set_address($path[0]) . 'css';

            if (file_exists($st_js_public_path) && is_dir($st_js_public_path)) {
                $ar_public_jsfile_list = array_slice(scandir($st_js_public_path), 2);
                foreach ($ar_public_jsfile_list as $js_file_name) {
                    $js_links .= $this->create_css_js_link($st_js_public_path . DS . $js_file_name, 'js');
                }
            }
            if (file_exists($st_css_public_path) && is_dir($st_css_public_path)) {
                $ar_public_cssfile_list = array_slice(scandir($st_css_public_path), 2);
                foreach ($ar_public_cssfile_list as $css_file_name) {
                    $css_links .= $this->create_css_js_link($st_css_public_path . DS . $css_file_name, 'css');
                }
            }

            //####### STYLE PUBLIC CSS & JS & PLUGINS FILES
            $st_js_style_public_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . 'public' . DS . $this->current_direction . DS . 'js';
            $st_css_style_public_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . 'public' . DS . $this->current_direction . DS . 'css';
            $st_plugin_style_public_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . 'public' . DS . $this->current_direction . DS . 'plugins' . DS . 'plugins.php';
            if (file_exists($st_css_style_public_path) && is_dir($st_css_style_public_path)) {
                $ar_cssfile_list = array_slice(scandir($st_css_style_public_path), 2);
                foreach ($ar_cssfile_list as $css_file_name) {
                    $css_links .= $this->create_css_js_link($st_css_style_public_path . DS . $css_file_name, 'css');
                }
            }
            if (file_exists($st_js_style_public_path) && is_dir($st_js_style_public_path)) {
                $ar_jsfile_list = array_slice(scandir($st_js_style_public_path), 2);
                foreach ($ar_jsfile_list as $js_file_name) {
                    $js_links .= $this->create_css_js_link($st_js_style_public_path . DS . $js_file_name, 'js');
                }
            }
            $st_plugins .= (file_exists($st_plugin_style_public_path) ) ? file_get_contents($st_plugin_style_public_path) : ' ';
            //####### MODULE CSS & JS FILES
            $st_js_style_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . $path[0] . DS . $this->current_direction . DS . 'js';
            $st_css_style_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . $path[0] . DS . $this->current_direction . DS . 'css';
            $st_plugin_path = '.' . DS . VIEW_DIR . DS . $this->current_style . DS . $path[0] . DS . $this->current_direction . DS . 'plugins' . DS . 'plugins.php';
            if (file_exists($st_css_style_path) && is_dir($st_css_style_path)) {
                $ar_cssfile_list = array_slice(scandir($st_css_style_path), 2);
                foreach ($ar_cssfile_list as $css_file_name) {
                    $css_links .= $this->create_css_js_link($st_css_style_path . DS . $css_file_name, 'css');
                }
            }
            if (file_exists($st_js_style_path) && is_dir($st_js_style_path)) {
                $ar_jsfile_list = array_slice(scandir($st_js_style_path), 2);
                foreach ($ar_jsfile_list as $js_file_name) {
                    $js_links .= $this->create_css_js_link($st_js_style_path . DS . $js_file_name, 'js');
                }
            }
            $st_plugins .= (file_exists($st_plugin_path) && $showstyle ) ? file_get_contents($st_plugin_path) : ' ';

            //################################################
            //################################################
            //################################################
            //################################################
            //@ @   @ CREATING CSS,JS ADDRESS
            $data['VARCSSADDR'] = $css_links;
            $data['VARJSADDR'] = $js_links . $st_plugins;
            $data['VARURL'] = '/';
            $data = array_merge($data, lang_translate::$lang);
            $template->display($data);
        } else {
            //$ar_langpropr = language::$ar_lanuage[session::get('current_lang')];
            //$data['lang_code'] = $ar_langpropr['lang_code'];
            $data = array_merge($data, lang_translate::$lang);
            return $this->twig->render($address . '.twig', $data);
        }
    }

i am using twig template engine so there are some unrelated code to your question here;else part is for ajax call. conclusion: 1-you can use this structure to add or delete file from a module as easy as copy or delete a file from it's folder. 2- you can use it to create correct js or css to create address by ajax and print it in your code

i hope it helped you and don't hesitate to as more question if you need

Answer 4

PHP include()'s are server-side.

JavaScript is client-side.

Therefore, you cannot use include() on a JavaScript.

However, if you would like to load a JavaScript with a URL that you want, use this: $url = "JAVASCRIPT URL HERE"; echo('<script src="'. $url .'"></script>'); $url = "JAVASCRIPT URL HERE"; echo('<script src="'. $url .'"></script>');