bootstrap有提供兩種驗證方法
- 伺服器端驗證
- 瀏覽器端驗證
透過:invalid和:valid來驗證是否該欄位是否通過驗證，
若沒通過該欄位外框呈現紅色，若有通過該欄位外框呈現綠色。
如果，是伺服器端驗證的話，需要自己手動在相對應元件的class中加入.is-invalid和.is-valid，
來替換掉:invalid和:valid。
伺服器端驗證
首先，來介紹伺服器端驗證的範例
首先，你要記得在那些要被驗證input的html標籤中加入required屬性。
接著，以上的範例，你可以看到，我們故意在firstname的input欄位和lastname的input欄位的class中加入is-valid，
此時，在畫面中，可以看到它們的input外框呈現綠色的，代表驗證正確。
那我們在下面的City, State, Road的input欄位的class中，都加入了is-invalid，
在畫面中，可以看到他們的input外框呈現紅色的，代表驗證錯誤。
那在驗證錯誤的欄位附近會呈現一段回饋的提示訊息，
這段回饋的提示訊息，你需要在相對應區塊中加入div區塊，並為這div區塊加入class名稱invalid-feedback，
接著，你在這個invalid-feedback的區塊裡面加入你想要呈現的錯誤回饋內容即可。
伺服器端驗證的範例中的is-valid和is-invalid，其實，實際的運作是當使用者輸入的內容，會由後端判斷其內容是否符合規範，此時，後端會回傳
是否使用者內容符合規範的提示給前端，接著前端再為這些input欄位的className中，動態地加入is-valid或is-invalid這兩個className。
瀏覽器端驗證
它是透過bootstrap提供的JavaScript內容去觸發某個還沒有被驗證的相對應表單，等到瀏覽器驗證完成後，再由瀏覽器回饋給我們。
所以，
我們必須在想要被驗證的form命名一個id名稱，並將該id名稱提供給script。
並且，也要在該form的html標籤加上novalidate，代表該表單還沒有被驗證。
那些需要錯誤回饋部分，一樣要加入class名稱為invalid-feedback的區塊，就像伺服器驗證那樣加到相對應的區塊中。
接著，你要加入bootstrap官網提供的script驗證的程式碼，而這段驗證的程式碼，在bootstrap的官網上就有提供了～～
加入瀏覽器驗證的JS程式碼，並輸入相對應form的id
你可以在以上範例的JavaScript中的程式碼看到，
有一段用getElementsByClassName去取得你的需要被驗證的表單className，你就填入你相對應的表單className後，就可以執行瀏覽器端驗證囉。
當你按下該form的傳送表單的鈕，就會觸發這段驗證，進而驗證你那些欄位沒有填入相對應的內容囉。
另外，傳送表單的按鈕的type屬性要設定為submit喔。
不需要在input欄位加入.is-valid和.is-invalid
記得～ 不需要在各個被驗證的input欄位的class中，加入.is-valid或.is-invalid，
因為，當瀏覽器驗證該欄位有誤，會自動的幫我們在該欄位加上.is-valid或.is-invalid，
並呈現相對應的驗證樣式囉。
記得加入required
記得～～要在需要被驗證的input欄位的html標籤中加入required的屬性喔，
不然，那一個input欄位是不會被驗證到的喔。