「每日一學」前端魔法王國：HTML與CSS奇跡創造者的冒險之旅

習總目標

本次學習目標

3. HTML

3.1 HTML概念

HTML是Hyper Text Markup Language的縮寫。意思是『超文本標記語言』。它的作用是搭建網頁結構，在網頁上展示內容

3.1.1 超文本

HTML文件本質上是文本文件，而普通的文本文件只能顯示字符。但是HTML技術則通過HTML標簽把其他網頁、圖片、音頻、視頻等各種多媒體資源引入到當前網頁中，讓網頁有了非常豐富的呈現方式，這就是超文本的含義——本身是文本，但是呈現出來的最終效果超越了文本。

3.1.2 標記語言

說HTML是一種『標記語言』是因為它不是向Java這樣的『編程語言』，因為它是由一系列『標簽』組成的，沒有常量、變量、流程控制、異常處理、IO等等這些功能。HTML很簡單，每個標簽都有它固定的含義和確定的頁面顯示效果。

標簽是通過一組尖括號+標簽名的方式來定義的：

<p>HTML is a very popular fore-end technology.</p>

這個例子中使用了一個p標簽來定義一個段落，<p>叫『開始標簽』，</p>叫『結束標簽』。開始標簽和結束標簽一起構成了一個完整的標簽。開始標簽和結束標簽之間的部分叫『文本標簽體』，也簡稱『標簽體』。

有的時候標簽里還帶有『屬性』：

<a href="http://www.xxx.com">show detail</a>

href=“http://www.xxx.com”就是屬性，href是『屬性名』，“http://www.xxx.com”是『屬性值』。

還有一種標簽是『單標簽』：

<input type="text" name="username" />

3.2 HTML的入門程序

3.3 HTML的結構

文檔聲明: HTML文件中第一行的內容，用來告訴瀏覽器當前HTML文檔的基本信息，其中最重要的就是當前HTML文檔遵循的語法標準。這里我們只需要知道HTML有4和5這兩個大的版本，HTML4版本的文檔類型聲明是：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
HTML5版本的文檔類型聲明是：
<!DOCTYPE html>
現在主流的技術選型都是使用HTML5，之前的版本基本不用了。

根標簽:html標簽是整個文檔的根標簽，所有其他標簽都必須放在html標簽里面。
頭部:head標簽用于定義文檔的頭部，其他頭部元素都放在head標簽里。頭部元素包括title標簽、script標簽、style標簽、link標簽、meta標簽等等。
主體:body標簽定義網頁的主體內容，在瀏覽器窗口內顯示的內容都定義到body標簽內。
注釋:HTML注釋的寫法是：


注釋的內容不會顯示到瀏覽器窗口內，是開發人員用來對代碼內容進行解釋說明。

3.4 HTML語法規則

根標簽有且只能有一個
無論是雙標簽還是單標簽都必須正確關閉
標簽可以嵌套但不能交叉嵌套
注釋不能嵌套
屬性必須有值，值必須加引號，單引號或雙引號均可
標簽名不區分大小寫但建議使用小寫

3.5 使用idea創建StaticWeb工程

3.6 HTML的各個標簽的使用

3.6.1 標題標簽

代碼

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>這是一級標題</h1>
<h2>這是二級標題</h2>
<h3>這是三級標題</h3>
<h4>這是四級標題</h4>
<h5>這是五級標題</h5>
<h6>這是六級標題</h6>
</body>
</html>

頁面效果

3.6.2 段落標簽

代碼

<p>There is clearly a need for CSS to be taken seriously by graphic artists. The Zen Garden aims to excite, inspire, and encourage participation. To begin, view some of the existing designs in the list. Clicking on any one will load the style sheet into this very page. The code remains the same, the only thing that has changed is the external .css file. Yes, really.</p>

頁面效果

3.6.3 換行標簽

代碼

We would like to see as much CSS1 as possible. CSS2 should be limited to widely-supported elements only. The css Zen Garden is about functional, practical CSS and not the latest bleeding-edge tricks viewable by 2% of the browsing public. <br/>The only real requirement we have is that your CSS validates.

3.6.4 無序列表標簽

代碼

<ul>
<li>Apple</li>
<li>Banana</li>
<li>Grape</li>
</ul>

頁面效果

3.6.5 超鏈接標簽(重要)

代碼

<body>


<a href="../01_html的入門/start.html">跳轉到start.html頁面</a><br/>

<a href="https://www.baidu.com" target="_blank">跳轉到百度</a>
</body>

點擊后跳轉到href屬性指定的頁面

3.6.6 圖片標簽(重點)

準備圖片文件

代碼


<img src="../img/mm.jpg" width="409" height="292"/>

頁面效果

3.6.7 塊標簽(重點)

『塊』并不是為了顯示文章內容的，而是為了方便結合CSS對頁面進行布局。塊有兩種，div是前后有換行的塊，span是前后沒有換行的塊。

把下面代碼粘貼到HTML文件中查看他們的區別：

<div style="border: 1px solid black;width: 100px;height: 100px;">This is a div block</div>
<div style="border: 1px solid black;width: 100px;height: 100px;">This is a div block</div>
<span style="border: 1px solid black;width: 100px;height: 100px;">This is a span block</span>
<span style="border: 1px solid black;width: 100px;height: 100px;">This is a span block</span>

3.6.8 HTML實體(了解)

在HTML文件中，<、>等等這樣的符號已經被賦予了特定含義，不會作為符號本身顯示到頁面上，此時如果我們想使用符號本身怎么辦呢？那就是使用HTML實體來轉義。

3.7 路徑介紹

在我們整個Web開發技術體系中，『路徑』是一個貫穿始終的重要概念。凡是需要獲取另外一個資源的時候都需要用到路徑。要想理解路徑這個概念，我們首先要認識一個概念：『文件系統』。

3.7.1 文件系統

我們寫代碼的時候通常都是在Windows系統來操作，而一個項目開發完成后想要讓所有人都能夠訪問到就必須『部署』到服務器上，也叫『發布』。而服務器通常是Linux系統。

Windows系統和Linux系統的文件系統有很大差別，為了讓我們編寫的代碼不會因為從Windows系統部署到了Linux系統而出現故障，實際開發時不允許使用物理路徑。

物理路徑舉例：
D:\aaa\pro01-HTML\page01-article-tag.html
D:\aaa\pro01-HTML\page02-anchor-target.html

幸運的是不管是Windows系統還是Linux系統環境下，目錄結構都是樹形結構，編寫路徑的規則是一樣的。

所以我們以項目的樹形目錄結構為依據來編寫路徑就不用擔心操作系統平臺發生變化之后路徑錯誤的問題了。有了這個大前提，我們具體編寫路徑時有兩種具體寫法：

相對路徑
絕對路徑

3.7.2 相對路徑

相對路徑都是以『當前位置』為基準來編寫的。假設我們現在正在瀏覽a頁面，想在a頁面內通過超鏈接跳轉到z頁面。

那么按照相對路徑的規則，我們現在所在的位置是a.html所在的b目錄：

z.html并不在b目錄下，所以我們要從b目錄出發，向上走，進入b的父目錄——c目錄：

c目錄還是不行，繼續向上走，進入c的父目錄——d目錄：

在從d目錄向下經過兩級子目錄——e目錄、f目錄才能找到z.html：

所以整個路徑的寫法是：

3.8 使用表格標簽展示數據(重要)

3.8.1 目標頁面效果

3.8.2 第一版代碼


<table>

<tr>

<th>姓名</th>
<th>屬性</th>
<th>級別</th>
<th>忍村</th>
</tr>
<tr>

<td>漩渦鳴人</td>
<td>風</td>
<td>下忍</td>
<td>木葉</td>
</tr>
<tr>
<td>宇智波佐助</td>
<td>雷&火</td>
<td>下忍</td>
<td>木葉</td>
</tr>
<tr>
<td>我愛羅</td>
<td>沙</td>
<td>影</td>
<td>砂隱村</td>
</tr>
</table>

如果只有上面的代碼，頁面顯示效果是：

沒有表格邊框。想要顯示好看的表格邊框可以把下面的style標簽代碼復制粘貼到head標簽里,CSS還沒講，不必在意語法細節，整體照搬即可。

<style type="text/css">
table,th,td {
border-collapse: collapse;
border: 1px solid black;
padding: 5px;
}
</style>

我們發現，相較于目標效果而言，還未實現橫縱向合并單元格

3.8.3 合并單元格

① 橫向合并單元格(列合并)

使用colspan屬性將兩個橫向相鄰的單元格跨列合并：

<tr>
<td>宇智波佐助</td>
<td>雷&火</td>
<td colspan="2">下忍</td>
</tr>

注意: 『被合并』的單元格要刪掉。

② 縱向合并單元格(行合并)

使用rowspan屬性將兩個縱向相鄰的單元格跨行合并：

<tr>
<td>宇智波佐助</td>
<td rowspan="2">雷&火</td>
<td colspan="2">下忍</td>
</tr>
<tr>
<td>我愛羅</td>
<td>影</td>
<td>砂隱村</td>
</tr>

注意: 『被合并』的單元格要刪掉。

3.9 表單標簽(最重要)

3.9.1 表單標簽的作用

在項目開發過程中，凡是需要用戶填寫的信息都需要用到表單。它的作用是接收用戶的輸入信息，并且將用戶輸入的信息提交給服務器

3.9.2 form標簽的介紹

在HTML中我們使用form標簽來定義一個表單。而對于form標簽來說有兩個最重要的屬性：action和method。

<form action="/aaa/pro01-HTML/page05-form-target.html" method="post">

</form>

① action屬性

用戶在表單里填寫的信息需要發送到服務器端，對于Java項目來說就是交給Java代碼來處理。那么在頁面上我們就必須正確填寫服務器端的能夠接收表單數據的地址。

這個地址要寫在form標簽的action屬性中。但是現在暫時我們還沒有服務器端環境，所以先借用一個HTML頁面來當作服務器端地址使用。

② method屬性

『method』這個單詞的意思是『方式、方法』，在form標簽中method屬性用來定義提交表單的『請求方式』。method屬性只有兩個可選值：get或post，沒有極特殊情況的話使用post即可。

什么是『請求方式』？

瀏覽器和服務器之間在互相通信時有大量的『數據』需要傳輸。但是不論是瀏覽器還是服務器都有很多不同廠商提供的不同產品。

常見的瀏覽器有：

Chrome
Firefox
Safari
Opera
Edge

常見的Java服務器有：

Tomcat
Weblogic
WebSphere
Glassfish
Jetty

這么多不同廠商各自開發的應用程序怎么能保證它們彼此之間傳輸的『數據』能夠被對方正確理解呢？

很簡單，我們給這些數據設定『格式』，發送端按照格式發送數據，接收端按照格式解析數據，這樣就能夠實現數據的『跨平臺傳輸』了。

而這里定義的『數據格式』就是應用程序之間的『通信協議』。

在JavaSE階段的網絡編程章節我們接觸過TCP/IP、UDP這樣的協議，而我們現在使用的『HTTP協議』的底層就是TCP/IP協議。

但是在HTML標簽中，點擊超鏈接是GET方式的請求，提交一個表單可以通過form標簽的method屬性指定GET或POST請求，其他請求方式無法通過HTML標簽實現。除了GET、POST之外的其他請求方式暫時我們不需要涉及（到我們學習SpringMVC時會用到PUT和DELETE）。至于GET請求和POST請求的區別我們會在講HTTP協議的時候詳細介紹，現在大家可以從表面現象來觀察一下。

3.10 表單項標簽

表單中的每一項，包括: 文本框、密碼框、單選框、多選框等等，都稱之為表單項，一個表單中可以包含多個表單項

3.10.1 name和value屬性

在用戶使用一個軟件系統時，需要一次性提交很多數據是非常正常的現象。我們肯定不能要求用戶一個數據一個數據的提交，而肯定是所有數據填好后一起提交。那就帶來一個問題，服務器怎么從眾多數據中識別出來收貨人、所在地區、詳細地址、手機號碼……？

很簡單，給每個數據都起一個『名字』，發送數據時用『名字』攜帶對應的數據，接收數據時通過『名字』獲取對應的數據。

在各個具體的表單標簽中，我們通過『name屬性』來給數據起『名字』，通過『value屬性』來保存要發送給服務器的『值』。

但是名字和值之間既有可能是『一個名字對應一個值』，也有可能是『一個名字對應多個值』。

這么看來這樣的關系很像我們Java中的Map，而事實上在服務器端就是使用Map類型來接收請求參數的。具體的是類型是：Map<String,String[]>。

name屬性就是Map的鍵，value屬性就是Map的值。

有了上面介紹的基礎知識，下面我們就可以來看具體的表單項標簽了。

3.10.2 單行文本框

代碼

個性簽名：<input type="text" name="signal"/><br/>

顯示效果

3.10.3 密碼框

代碼

密碼：<input type="password" name="secret"/><br/>

顯示效果

3.10.4 單選框

代碼

你最喜歡的季節是：
<input type="radio" name="season" value="spring" />春天
<input type="radio" name="season" value="summer" checked="checked" />夏天
<input type="radio" name="season" value="autumn" />秋天
<input type="radio" name="season" value="winter" />冬天
<br/><br/>
你最喜歡的動物是：
<input type="radio" name="animal" value="tiger" />路虎
<input type="radio" name="animal" value="horse" checked="checked" />寶馬
<input type="radio" name="animal" value="cheetah" />捷豹

顯示效果

說明:

name屬性相同的radio為一組，組內互斥
當用戶選擇了一個radio并提交表單，這個radio的name屬性和value屬性組成一個鍵值對發送給服務器
設置checked=“checked”屬性設置默認被選中的radio

3.10.5 多選框

代碼

你最喜歡的球隊是：
<input type="checkbox" name="team" value="Brazil"/>巴西
<input type="checkbox" name="team" value="German" checked="checked"/>德國
<input type="checkbox" name="team" value="France"/>法國
<input type="checkbox" name="team" value="China" checked="checked"/>中國
<input type="checkbox" name="team" value="Italian"/>意大利

顯示效果

說明:

設置checked=“checked”屬性設置默認被選中的checkbox

3.10.6 下拉框

代碼

你喜歡的運動是：
<select name="interesting">
<option value="swimming">游泳</option>
<option value="running">跑步</option>
<option value="shooting" selected="selected">射擊</option>
<option value="skating">溜冰</option>
</select>

顯示效果

說明:

下拉列表用到了兩種標簽，其中select標簽用來定義下拉列表，而option標簽設置列表項。
name屬性在select標簽中設置。
value屬性在option標簽中設置。
option標簽的標簽體是顯示出來給用戶看的，提交到服務器的是value屬性的值。
通過在option標簽中設置selected=“selected”屬性實現默認選中的效果。

3.10.7 按鈕

代碼

<button type="button">普通按鈕</button>或<input type="button" value="普通按鈕"/>
<button type="reset">重置按鈕</button>或<input type="reset" value="重置按鈕"/>
<button type="submit">提交按鈕</button>或<input type="submit" value="提交按鈕"/>

顯示效果

說明:

普通按鈕: 點擊后無效果，需要通過JavaScript綁定單擊響應函數
重置按鈕: 點擊后將表單內的所有表單項都恢復為默認值提交按鈕
提交按鈕: 點擊后提交表單

3.10.8 隱藏域

代碼

<input type="hidden" name="userId" value="2233"/>

說明:

通過表單隱藏域設置的表單項不會顯示到頁面上，用戶看不到。但是提交表單時會一起被提交。用來設置一些需要和表單一起提交但是不希望用戶看到的數據，例如：用戶id等等。

3.10.9 多行文本框

代碼

自我介紹：<textarea name="desc"></textarea>

顯示效果

說明:

textarea沒有value屬性，如果要設置默認值需要寫在開始和結束標簽之間。

3.10.10 文件表單

代碼

頭像:<input type="file" name="file"/>

顯示效果

說明:

不同瀏覽器顯示的樣式有微小差異

DEA簡介

IDEA全稱是IntelliJ，是JetBrains公司推出一個集成開發工具，是Java開發工具中的翹楚，基于這個開發工具可以快速開發我們的Java相關項目。相對于其它開發工具，IDEA提供了更加強大的提示功能，全面的快捷鍵操作，模板代碼以及快速的資源整合。

下載與安裝

準備工作

硬件(Hardware)要求1)內存8G或以上
2)硬盤磁盤空閑空間大于5GB，最好有一塊固態硬盤。
軟件(Software)要求1)Microsoft Windows 8 or later
2)macOS 10.13 or later
3)Any Linux distribution
4)Set Up and Config JDK1.8

IDEA工具下載

IDEA官網下載地址如下：

https://www.jetbrains.com/idea/

基于操作系統的不同，可以選擇不同平臺下的IDEA，例如：

說明:至于社區版(功能受限的免費版)/還是商業版(可試用)自行決定。

IDEA工具安裝

IDEA 下載以后需要進行安裝進行使用。假如只是下載的解壓版本，則可以將其拷貝到非中文目錄，然后直接解壓進行應用。假如下載的可執行程序（例如windows平臺下的.exe文件)則直接啟動可執行程序，然后按照提示，一步一步安裝即可。

IDEA官方幫助文檔文檔參考如下：

https://www.jetbrains.com/help/idea/discover-intellij-idea.html

IDEA工具啟動

找到解壓或安裝好的idea根目錄，然后進入bin目錄找到idea.bat或者idea64.exe文件，然后直接雙擊進行啟動，第一個啟動歡迎界面如圖所示：

在第一個界面呈現過程中，其實是IDEA底層在進行啟動初始化，假如是第一次啟動，稍等片刻會進入第二個界面，例如：

在第二個界面中，我們先選擇創建新項目（New Project)，然后進入創建項目的界面，這里我們先選擇創建空項目，如圖所示：

選擇好Empty Project以后，點擊next進入項目的設計，如圖所示：

在上面圖中，點擊Finish按鈕完成項目的創建，進入IDEA的項目工作窗口，如圖所示：

IDEA 基本配置

Appearance(顯示)主題配置

KeyMap(快捷鍵)配置

Editor(編輯區)配置

General 配置

滾輪滑動，改變字體大小配置,如圖所示：

包導入配置，如圖所示：

行號與方法分隔符配置，如圖所示：

代碼提示配置，如圖所示：

代碼補全配置，如圖所示：

Font 配置

代碼編輯區字體配置，如圖所示：

控制臺字體配置，如圖所示：

Color 配置

代碼中的注釋顏色配置，如圖所示：

File 編碼配置

Build 執行配置

Compiler(編譯配置)

自動編譯配置(可選),選上了可能會比較慢，如圖所示：

Build Tools 中的Maven配置

Maven 初始化配置(假如已有配置好的，可以使用已有的配置）

找到你磁盤中的maven根目錄下的conf目錄，并打開conf目錄下的settings.xml文件，然后進行如下配置：

配置maven本地庫(從maven遠程服務器下載的資源存儲到的位置)

<localRepository>${user.home}/.m5/repository</localRepository>

配置maven私服(配置到mirrors標簽內部)。

   <mirror>
    <id>aliyun</id>
    <name>aliyun for maven</name>
    <mirrorOf>*</mirrorOf>
    <url>https://maven.aliyun.com/repository/public</url>
   </mirror>

配置maven中的profile（配置到profiles標簽內部）,設置JDK編譯和運行版本。

<profile>
   <id>jdk-1.8</id>
   <activation>
    <activeByDefault>true</activeByDefault>
      <jdk>1.8</jdk>
   </activation>
   <properties>
       <maven.compiler.source>1.8</maven.compiler.source>
       <maven.compiler.target>1.8</maven.compiler.target>
       <maven.compiler.compilerVersion>1.8
       </maven.compiler.compilerVersion>
   </properties>
 </profile>

IDEA 中集成Maven配置

找到Build Tools/Maven選項，然后在IDEA中集成本地maven配置。如圖所示：

Version Control 配置

安裝gitee插件

Gitee 安裝成功以后，檢查是否在Version Control中有Gitee選項，如圖所示：

點擊Version Control的Gitee選項，進入Gitee配置，如圖所示：

在Gitee配置界面，選擇添加賬戶(Add Account)，進入賬戶配置界面，如圖所示：

在Gitee賬戶配置界面，進行連接Gitee平臺的賬戶配置（要事先注冊好Gitee平臺賬戶），然后點擊Log in進行登陸，登陸成功以后會呈現如下界面，如圖所示：

總結(Summary)

本小節主要是對IDEA開發工具進行了一個簡單介紹，然后基于我們后續要做的應用，做了一個初步配置，基于這個配置我們后續可以更好的展開項目的創建、測試等。

DEA 全稱 IntelliJ IDEA，是java編程語言開發的集成環境。IntelliJ在業界被公認為最好的java開發工具，尤其在智能代碼助手、代碼自動提示、重構、JavaEE支持、各類版本工具(git、svn等)、JUnit、CVS整合、代碼分析、創新的GUI設計等方面的功能可以說是超常的。IDEA是JetBrains公司的產品，這家公司總部位于捷克共和國的首都布拉格，開發人員以嚴謹著稱的東歐程序員為主。它的旗艦版本還支持HTML，CSS，PHP，MySQL，Python等。免費版只支持Java,Kotlin等少數語言。

俗話說：＂工欲善其事必先利其器＂，今天準備和大家一起分享一下實際工作中能提升幸福感和工作效率的IDEA插件。

廢話不多說，let's go ！！！

1Alibaba Java Coding Guidelines

【阿里巴巴代碼規范檢查插件】

在你需要檢查的代碼上面，點擊右鍵，選擇編碼規約掃描

將會出現如下所示的檢查結果，并會給出編碼規范和提示：

2GsonFormat

【jsonToBean】

在平時的開發中，將json轉為Bean

3A8Translation

【翻譯的插件】

選中你要翻譯的漢語或英文，點擊鼠標右鍵，選擇Translate, （快捷鍵是Alt+T）就會實現翻譯，不用再去切換屏幕使用翻譯軟件翻譯了。

4Maven Helper

【分析依賴沖突的插件】

此插件可用來方便顯示maven的依賴樹，和顯示沖突，在我們梳理依賴時幫助很大。

5Free Mybatis plugin

【增強idea對mybatis支持的插件】

生成mapper xml文件快速從代碼跳轉到mapper及從mapper返回代碼 mybatis自動補全及語法錯誤提示集成mybatis generator gui界面這個插件超級實用，可以從mapper接口跳轉到mybatis的xml文件中，還能找到對應地方

6Grep Console

【日志高亮顯示插件】

可以Ctrl + Alt +S Other Settings進行配色（顏色參考請搜索：電腦最護眼的色彩、顯示屏亮度亦如此）

7Lombok

當我們創建一個實體時，通常對每個字段去生成GET/SET方法，但是萬一后面需要增加或者減少字段時，又要重新的去生成GET/SET方法，非常麻煩。可以通過該插件，無需再寫那么多冗余的get/set代碼。

注意：需要在pom引入依賴

<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
</dependency>

8Nyan progress bar

基于Idea使用的漂亮進度條。把你的加載進度條全都變成彩虹和貓咪

9FindBugs-IDEA

【Bug檢查插件】

在文件上或文件里面點擊鼠標右鍵，選擇FingBugs

簡單的bug能給你快速找回來，什么NPE啥的，小兒科！推薦！！（嗓門大就說一遍）

10Key Promoter X

你還在為記不住快捷鍵煩惱嗎，Key Promoter X可以幫助你快速記住常用的快捷鍵。當你在idea中用鼠標點擊菜單，它可以顯示對應的快捷鍵以及點擊次數。使用一段時間后有助于過渡到更快、無鼠標的開發。

11JavaDoc

在項目中經常要求寫代碼注釋，否則不能通過代碼門禁，JavaDoc工具可以一鍵生成注釋。

插件安裝成功后在菜單欄 code -> JavaDocs可以找到

自動生成注釋效果如下：

12ignore

項目開發中通常會使用到git進行版本管理，在提交代碼時經常有人將本地的不必要的文件提交到代碼倉庫中，使用.ignore插件可以很好解決這個問題。插件安裝完成后會在項目中生成一個.ignore文件，編輯該文件忽略一些動態生成的文件，如class文件，maven的target目錄等。

13RainbowBrackets

彩虹括號，代碼中有多個括號會顯示不同的顏色。

14Activate-power-mode

在敲代碼時有抖動酷炫的特效，非常適合給前端小姐姐表演特技。（壞笑）

15CodeGlance

16GenerateAllSetter

通過alt+enter對變量類生成對類的所有setter方法的調用
當兩個對象具有相同的字段時生成一個轉換器
當returnType為List Set Map時生成默認值
在所有getter方法上生成對assertThat的調用

17RestfulToolkit

根據 URL 直接跳轉到對應的方法定義 ( 快捷鍵搜索 Ctrl + Alt + N 或者 Ctrl + \ ); —這個個人感覺非常好用，和Ctrl + F一樣重要。
提供了一個 Services tree 的顯示窗口;
一個簡單的 http 請求工具;
在請求方法上添加了有用功能: 復制生成 URL;,復制方法參數…
其他功能: java 類上添加 Convert to JSON 功能，格式化 json 數據 ( Windows: Ctrl + Enter; Mac: Command + Enter )。

18JRebel

熱門部署插件，讓你在修改完代碼后，不用再重新啟動，很實用！但是，不是免費的，需要大家發揮下聰明才智自行百度破解！

19Json Parser

厭倦了打開瀏覽器格式化和驗證JSON?為什么不安裝JSON解析器并在IDE中使用離線支持呢?JSON解析器是一個用于驗證和格式化JSON字符串的輕量級插件。

20aiXcode & codota

aiXcoder是一個強大的代碼完成器和代碼搜索引擎，基于最新的深度學習技術。它有可能向您推薦一整套代碼，這將幫助您更快地編寫代碼。aiXcoder還提供了一個代碼搜索引擎，以幫助您在GitHub上搜索API用例。

類似功能的插件還有codota，codota基于數百萬個開源Java程序和您的上下文來完成代碼行，從而幫助您以更少的錯誤更快地進行編碼。新版本的codota提供以下功能：

全線AI自動完成
內聯和相關代碼示例
根據用戶自己的編碼實踐進行編碼建議
不用擔心你的代碼會被公開。codota不會將你的代碼發送到codota服務器，它只會從當前編輯的文件中發送最少的上下文信息，從而使codota能夠根據你當前的本地范圍進行預測。

比如我想知道list.stream.map(…)方法的參考使用,只需要光標定位在map上，然后右鍵選擇菜單“Get relevant examples”或者使用快捷鍵“Ctrl + Shift + O”就可以快速搜索出來很多示例，非常方便。

來源：blog.csdn.net/CSDN_SAVIOR/article/details/122505538

在線咨詢

上一篇：uniapp中scroll-view局部滾動的各種場景
下一篇：什么手機瀏覽器自帶翻譯插件？分享5個網頁翻譯方法

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商

「每日一學」前端魔法王國：HTML與CSS奇跡創造者的冒險之旅

DEA簡介

下載與安裝

準備工作

IDEA工具下載

IDEA工具安裝

IDEA工具啟動

IDEA 基本配置

Appearance(顯示)主題配置

KeyMap(快捷鍵)配置

Editor(編輯區)配置

General 配置

Font 配置

Color 配置

File 編碼配置

Build 執行配置

Compiler(編譯配置)

Build Tools 中的Maven配置

Version Control 配置

安裝gitee插件

總結(Summary)

您的項目需求