[**Solved**]
Кажется, я не могу добавить таблицы данных к моей таблице. Можете ли вы помочь мне выяснить, что я делаю неправильно?
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
У него нет datatables jquery Плагин IDK, почему у него есть код. Это ссылки и сценарии, которые я сейчас использую, чтобы попытаться увидеть, работает ли, я уже использовал соединение на официальном сайте, и оно тоже не работало. Я попытался создать новую страницу html, и она сработала, но в этом она, похоже, не работает. Если вы хотите скачать файлы, вот ссылка http://sendanywhe.re/Z1UV5OCM Я не знаю другого способа отправки файлов. Проблема, которую я определяю и думаю, заключается в том, что bootstrap или другая вещь блокирует плагин datatables jquery.
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags-->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="au theme template">
<meta name="author" content="Hau Nguyen">
<meta name="keywords" content="au theme template">
<!-- Title Page-->
<title>Tables</title>
<!-- Fontfaces CSS-->
<link href="css/font-face.css" rel="stylesheet" media="all">
<link href="vendor/font-awesome-4.7/css/font-awesome.min.css" rel="stylesheet" media="all">
<link href="vendor/font-awesome-5/css/fontawesome-all.min.css" rel="stylesheet" media="all">
<link href="vendor/mdi-font/css/material-design-iconic-font.min.css" rel="stylesheet" media="all">
<!-- Bootstrap CSS-->
<link href="vendor/bootstrap-4.1/bootstrap.min.css" rel="stylesheet" media="all">
<!-- Vendor CSS-->
<link href="vendor/animsition/animsition.min.css" rel="stylesheet" media="all">
<link href="vendor/bootstrap-progressbar/bootstrap-progressbar-3.3.4.min.css" rel="stylesheet" media="all">
<link href="vendor/wow/animate.css" rel="stylesheet" media="all">
<link href="vendor/css-hamburgers/hamburgers.min.css" rel="stylesheet" media="all">
<link href="vendor/slick/slick.css" rel="stylesheet" media="all">
<link href="vendor/select2/select2.min.css" rel="stylesheet" media="all">
<link href="vendor/perfect-scrollbar/perfect-scrollbar.css" rel="stylesheet" media="all">
<!-- Main CSS-->
<link href="css/theme.css" rel="stylesheet" media="all">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
<script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>
</head>
<body class="animsition">
<div class="page-wrapper">
<!-- HEADER MOBILE-->
<header class="header-mobile d-block d-lg-none">
<div class="header-mobile__bar">
<div class="container-fluid">
<div class="header-mobile-inner">
<a class="logo" href="index.html">
<img src="images/Logo-horiz.png" alt="CoolAdmin" />
</a>
<button class="hamburger hamburger--slider" type="button">
<span class="hamburger-box">
<span class="hamburger-inner"></span>
</span>
</button>
</div>
</div>
</div>
<nav class="navbar-mobile">
<div class="container-fluid">
<ul class="navbar-mobile__list list-unstyled">
<li class="has-sub">
<a class="js-arrow" href="index.php">
<i class="fas fa-tachometer-alt"></i>Pagina Inicial</a>
</li>
<li>
<a href="chart.php">
<i class="fas fa-chart-bar"></i>Adicionar Itens</a>
</li>
<li>
<a href="table.php">
<i class="fas fa-table"></i>Itens Atuais</a>
</li>
<li>
<a href="form.html">
<i class="far fa-check-square"></i>Clientes</a>
</li>
<li>
<a href="calendar.html">
<i class="fas fa-calendar-alt"></i>Detalhe De Encomendas</a>
</li>
</ul>
</div>
</nav>
</header>
<!-- END HEADER MOBILE-->
<!-- MENU SIDEBAR-->
<aside class="menu-sidebar d-none d-lg-block">
<div class="logo">
<a href="#">
<img src="images/icon/logo.png" alt="Cool Admin" />
</a>
</div>
<div class="menu-sidebar__content js-scrollbar1">
<nav class="navbar-sidebar">
<ul class="list-unstyled navbar__list">
<li class="has-sub">
<a class="js-arrow" href="#">
<i class="fas fa-tachometer-alt"></i>Pagina Principal</a>
</li>
<li>
<a href="chart.html">
<i class="fas fa-chart-bar"></i>Charts</a>
</li>
<li class="active">
<a href="table.html">
<i class="fas fa-table"></i>Tables</a>
</li>
<li>
<a href="form.html">
<i class="far fa-check-square"></i>Forms</a>
</li>
<li>
<a href="calendar.html">
<i class="fas fa-calendar-alt"></i>Calendar</a>
</li>
<li>
<a href="map.html">
<i class="fas fa-map-marker-alt"></i>Maps</a>
</li>
</ul>
</nav>
</div>
</aside>
<!-- END MENU SIDEBAR-->
<!-- PAGE CONTAINER-->
<div class="page-container">
<!-- HEADER DESKTOP-->
<header class="header-desktop">
<div class="section__content section__content--p30">
<div class="container-fluid">
<div class="header-wrap">
<form class="form-header" action="" method="POST">
</form>
<div class="header-button">
<div class="account-wrap">
<div class="account-item clearfix js-item-menu">
<div class="image">
<img src="images/icon/avatar-01.jpg" alt="John Doe" />
</div>
<div class="content">
<a class="js-acc-btn" href="#">Admin</a>
</div>
<div class="account-dropdown js-dropdown">
<div class="info clearfix">
<div class="image">
<a href="#">
<img src="images/icon/avatar-01.jpg" alt="John Doe" />
</a>
</div>
<div class="content">
<h5 class="name">
<a href="#">Admin</a>
</h5>
<span class="email">???</span>
</div>
</div>
<div class="account-dropdown__footer">
<a href="#">
<i class="zmdi zmdi-power"></i>Logout</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- END HEADER DESKTOP-->
<!-- MAIN CONTENT-->
<div class="main-content">
<div class="section__content section__content--p30">
<div class="container-fluid">
<div class="row m-t-30">
<div class="col-md-12">
<div class="table-responsive ">
<table id="example" class="table table-borderless table-striped table-earning">
<thead>
<tr>
<th>Referência</th>
<th>Nome</th>
<th>Descrição Detalhada</th>
<th class="text-right">Preço de Custo</th>
<th>Margem/%</th>
<th>Stock</th>
<th>IVA</th>
<th>Familia</th>
</tr>
</thead>
<tbody>
<tr>
<td>2018-09-29 05:57</td>
<td>100398</td>
<td>iPhone X 64Gb Grey</td>
<td class="text-right">$999.00</td>
<td class="text-right">1</td>
<td class="text-right">$999.00</td>
</tr>
<tr>
<td>2018-09-28 01:22</td>
<td>100397</td>
<td>Samsung S8 Black</td>
<td class="text-right">$756.00</td>
<td class="text-right">1</td>
<td class="text-right">$756.00</td>
</tr>
<tr>
<td>2018-09-27 02:12</td>
<td>100396</td>
<td>Game Console Controller</td>
<td class="text-right">$22.00</td>
<td class="text-right">2</td>
<td class="text-right">$44.00</td>
</tr>
<tr>
<td>2018-09-26 23:06</td>
<td>100395</td>
<td>iPhone X 256Gb Black</td>
<td class="text-right">$1199.00</td>
<td class="text-right">1</td>
<td class="text-right">$1199.00</td>
</tr>
<tr>
<td>2018-09-25 19:03</td>
<td>100393</td>
<td>USB 3.0 Cable</td>
<td class="text-right">$10.00</td>
<td class="text-right">3</td>
<td class="text-right">$30.00</td>
</tr>
<tr>
<td>2018-09-29 05:57</td>
<td>100392</td>
<td>Smartwatch 4.0 LTE Wifi</td>
<td class="text-right">$199.00</td>
<td class="text-right">6</td>
<td class="text-right">$1494.00</td>
</tr>
<tr>
<td>2018-09-24 19:10</td>
<td>100391</td>
<td>Camera C430W 4k</td>
<td class="text-right">$699.00</td>
<td class="text-right">1</td>
<td class="text-right">$699.00</td>
</tr>
<tr>
<td>2018-09-22 00:43</td>
<td>100393</td>
<td>USB 3.0 Cable</td>
<td class="text-right">$10.00</td>
<td class="text-right">3</td>
<td class="text-right">$30.00</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="row m-t-30">
<div class="col-md-12">
<!-- DATA TABLE-->
<div class="table-responsive m-b-40">
<table class="table table-borderless table-data3">
<thead>
<tr>
<th>date</th>
<th>type</th>
<th>description</th>
<th>status</th>
<th>price</th>
</tr>
</thead>
<tbody>
<tr>
<td>2018-09-29 05:57</td>
<td>Mobile</td>
<td>iPhone X 64Gb Grey</td>
<td class="process">Processed</td>
<td>$999.00</td>
</tr>
<tr>
<td>2018-09-28 01:22</td>
<td>Mobile</td>
<td>Samsung S8 Black</td>
<td class="process">Processed</td>
<td>$756.00</td>
</tr>
<tr>
<td>2018-09-27 02:12</td>
<td>Game</td>
<td>Game Console Controller</td>
<td class="denied">Denied</td>
<td>$22.00</td>
</tr>
<tr>
<td>2018-09-26 23:06</td>
<td>Mobile</td>
<td>iPhone X 256Gb Black</td>
<td class="denied">Denied</td>
<td>$1199.00</td>
</tr>
<tr>
<td>2018-09-25 19:03</td>
<td>Accessories</td>
<td>USB 3.0 Cable</td>
<td class="process">Processed</td>
<td>$10.00</td>
</tr>
<tr>
<td>2018-09-29 05:57</td>
<td>Accesories</td>
<td>Smartwatch 4.0 LTE Wifi</td>
<td class="denied">Denied</td>
<td>$199.00</td>
</tr>
<tr>
<td>2018-09-24 19:10</td>
<td>Camera</td>
<td>Camera C430W 4k</td>
<td class="process">Processed</td>
<td>$699.00</td>
</tr>
<tr>
<td>2018-09-22 00:43</td>
<td>Computer</td>
<td>Macbook Pro Retina 2017</td>
<td class="process">Processed</td>
<td>$10.00</td>
</tr>
</tbody>
</table>
</div>
<!-- END DATA TABLE-->
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="copyright">
<p>Copyright © 2018 Colorlib. All rights reserved. Template by <a href="https://colorlib.com">Colorlib</a>.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Jquery JS-->
<script src="vendor/jquery-3.2.1.min.js"></script>
<!-- Bootstrap JS-->
<script src="vendor/bootstrap-4.1/popper.min.js"></script>
<script src="vendor/bootstrap-4.1/bootstrap.min.js"></script>
<!-- Vendor JS -->
<script src="vendor/slick/slick.min.js">
</script>
<script src="vendor/wow/wow.min.js"></script>
<script src="vendor/animsition/animsition.min.js"></script>
<script src="vendor/bootstrap-progressbar/bootstrap-progressbar.min.js">
</script>
<script src="vendor/counter-up/jquery.waypoints.min.js"></script>
<script src="vendor/counter-up/jquery.counterup.min.js">
</script>
<script src="vendor/circle-progress/circle-progress.min.js"></script>
<script src="vendor/perfect-scrollbar/perfect-scrollbar.js"></script>
<script src="vendor/chartjs/Chart.bundle.min.js"></script>
<script src="vendor/select2/select2.min.js">
</script>
<!-- Main JS-->
<script src="js/main.js"></script>
<script>
$(document).ready( function () {
var table = $('#example').DataTable();
} );
</script>
</body>
</html>
<!-- end document-->