本功能主要參考官網的filter例子，地址如下

該功能主要實現了在右上方選擇需要查詢要輸的欄位，並輸入相應欄位要查詢的值，支援模糊查詢，在點選查詢之後，地圖介面上顯示查詢出的要素並定位到這些要素，在介面的下部顯示這些要素的屬性值，下圖是最後的結果圖

所有查詢過程都在查詢按鈕的點選事件下，

首先獲取到要查詢的欄位和輸入的查詢值

如果輸入的查詢值不為空，則形成一個查詢要素請求，通過WFS的writeGetFeature函式形成查詢請求，檢視官網API，featureNS與featurePrefix是必填引數，但是由於實在是不明白這兩個引數的意思，所以就去掉了這兩個引數，沒想到對查詢沒有什麼影響，featureTypes引數就是你要查詢的要素名，關鍵的引數就是filter，這個引數是核心，通過ol.format.filter.like()可以設定查詢條件，兩個引數，第一個引數就是要查詢的欄位名，第二個引數我在查詢值的前後添加了萬用字元，可以實現模糊查詢，當然，官網API中還有很多這樣的查詢條件函式

將上一步形成的查詢請求用new XMLSerializer().serializeToString()格式化傳遞個fetch的body引數，fetch相當於另一種$.Ajax()，不過肯定是有區別的，可自行百度

返回的是json格式的資料，先用json.totalFeatures屬性判斷結返回果是否為空，如果不為空，則進行下一步

這部分是對返回的json資料進行處理，在每次查詢的時候都要清除上一次查詢的結果，在獲得屬性前，宣告properties的陣列為空可以使得每次查詢清除上一次查詢的屬性值，vectorSource.clear()可以清除上一次在地圖上顯示的查詢結果

讀取json要素，獲取要素所有欄位，利用vectorSource.forEachFeature()迴圈每個要素獲取其屬性值並放入properties陣列中，再後去所有要素的extent值，map.getView().fit(extent)定位到查詢要素

最後使用兩個自己寫的函式處理屬性資料的顯示，removeTable()函式移除上一次查詢結果，addFeatureInfo(keys, properties)顯示當前查詢結果

注意：

1、vectorSource.forEachFeature()函式的使用必須在vectorSource.addFeatures(features)語句之後也就是必須將source載入到圖層之後才能獲取source的feature

2、forEachFeature()函式是source的方法，不是features的方法