### （6）集成JQuery、Bootstrap
**集成jquery**
[jquery 下載地址](https://jquery.com/download/)
index.jsp 頭部增加獲取項(xiàng)目根目錄（獲取當(dāng)前上下文）
```html
<%String path = request.getContextPath();%>
```
然后在body中增加以下js
```javascript
<script type="text/javascript" src="<%=path %>/static/lib/jquery/jquery-3.5.1.min.js"></script>
<script type="text/javascript">
$(function() {
alert(1111);
});
</script>
```
沒(méi)有報(bào)錯(cuò)Uncaught ReferenceError: $ is not defined，則表示集成成功
**集成Bootstrap**
[Bootstrap 下載地址]([https://v3.bootcss.com/](https://v3.bootcss.com/))
增加css樣式文件
```css
<link rel="stylesheet" href="<%=path %>/static/lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
```
增加js文件
```javascript
<script type="text/javascript" src="<%=path %>/static/lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
```
**完整文件示例**
```html
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%String path = request.getContextPath();%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>首頁(yè)</title>
<link rel="stylesheet" href="<%=path %>/static/lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
</head>
<body>
<button>這是原生的按鈕</button>
<button type="button" class="btn btn-success">Bootstrap Success</button>
<script type="text/javascript" src="<%=path %>/static/lib/jquery/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="<%=path %>/static/lib/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(function() {
alert(1111);
});
</script>
</body>
</html>
```
- 1、JavaWeb基礎(chǔ)視頻教程
- 2、JavaWeb視頻筆記
- （1）JDK安裝教程
- （2）Tomcat安裝教程
- （3）MySQL安裝教程
- （4）Eclipse安裝教程
- （5）Eclipse新建Web項(xiàng)目
- （6）集成JQuery、Bootstrap3
- （7）Java連接MySQL數(shù)據(jù)庫(kù)
- （8）搭建用戶管理系統(tǒng)-頁(yè)面
- （9）搭建用戶管理系統(tǒng)-數(shù)據(jù)庫(kù)
- （10）實(shí)現(xiàn)查詢用戶功能
- （11）實(shí)現(xiàn)新增用戶功能
- （12）實(shí)現(xiàn)編輯用戶功能
- （13）實(shí)現(xiàn)刪除用戶功能