CodeIgniter - Hinzufügen von JS & CSS

Das Hinzufügen von JavaScript- und CSS-Dateien (Cascading Style Sheet) in CodeIgniter ist sehr einfach. Sie müssen den JS- und CSS-Ordner im Stammverzeichnis erstellen und alle JS-Dateien im JS-Ordner und die CSS-Dateien im CSS-Ordner kopieren, wie in der Abbildung gezeigt.

Angenommen, Sie haben eine JavaScript-Datei erstellt sample.js und eine CSS-Datei style.css. Laden Sie nun, um diese Dateien zu Ihren Ansichten hinzuzufügen, den URL-Helfer wie unten gezeigt in Ihren Controller.

$this->load->helper('url');

Fügen Sie nach dem Laden des URL-Hilfsprogramms in den Controller einfach die unten angegebenen Zeilen in die Ansichtsdatei ein, um die Dateien sample.js und style.css wie unten gezeigt in die Ansicht zu laden.

<link rel = "stylesheet" type = "text/css" 
   href = "<?php echo base_url(); ?>css/style.css">

<script type = 'text/javascript' src = "<?php echo base_url(); 
   ?>js/sample.js"></script>

Beispiel

Erstellen Sie einen Controller namens Test.php und speichern Sie es in application/controller/Test.php

<?php 
   class Test extends CI_Controller {
	
      public function index() { 
         $this->load->helper('url'); 
         $this->load->view('test'); 
      } 
   } 
?>

Erstellen Sie eine Ansichtsdatei mit dem Namen test.php und speichern Sie es bei application/views/test.php

<!DOCTYPE html> 
<html lang = "en">
 
   <head> 
      <meta charset = "utf-8"> 
      <title>CodeIgniter View Example</title> 
      <link rel = "stylesheet" type = "text/css" 
         href = "<?php echo base_url(); ?>css/style.css"> 
      <script type = 'text/javascript' src = "<?php echo base_url(); 
         ?>js/sample.js"></script> 
   </head>
	
   <body> 
      <a href = 'javascript:test()'>Click Here</a> to execute the javascript function. 
   </body>
	
</html>

Erstellen Sie eine CSS-Datei mit dem Namen style.css und speichern Sie es bei css/style.css

body { 
   background:#000; 
   color:#FFF; 
}

Erstellen Sie eine JS-Datei mit dem Namen sample.js und speichern Sie es bei js/sample.js

function test() { 
   alert('test'); 
}

Ändere das routes.php Datei in application/config/routes.php um eine Route für den obigen Controller hinzuzufügen und die folgende Zeile am Ende der Datei hinzuzufügen.

$route['profiler'] = "Profiler_controller"; 
$route['profiler/disable'] = "Profiler_controller/disable"

Verwenden Sie die folgende URL im Browser, um das obige Beispiel auszuführen.

http://yoursite.com/index.php/test

CodeIgniter - Hinzufügen von JS &amp; CSS

Beispiel

CodeIgniter - Hinzufügen von JS & CSS