“`可用於設定檔，雖然有很多方法可以將兩個或兩個以上物件合併，但龜毛如我，希望可以以第一個物件為基準，後續物件向前覆蓋，遇到相同 key 就覆蓋，這很適合用在設定檔，可以有效限制傳入設定檔僅在允許的 key 中。
可參考以下，隨便看
[……]
分類: jQuery
全景圖片容器，卷軸自動滾動至圖片中央，自製 jQuery 插件
在互動式網頁設計中，有時我們會遇到需要將全景圖片展示在容器中，並希望頁面加載時自動將滾動條調整至圖片的正中央位置。這篇文章將通過一個簡單的例子，展示如何自製一個 jQuery 插件來達成這個目的。
HTML 結構
使用了一張 Unsplash 全景的風景照片作為範例
CSS 樣式
要確保圖片可以超出其容器的寬度並觸發滾動效果，我們需要適當的 CSS 樣式。
自製 jQuery 插件
封裝成一個 jQuery 插件，使其易於在不同項目中重複使用。
使用範例
使用這個插件很簡單，您只需要選擇您的容器並調用 centerPanoramaScroll() 方法。
這個插件幫助您實現了在頁面加載時自動將橫向滾動條滾動至全景圖片中央的功能，無需進行繁瑣的計算或手動調整。
我們在 CodePen 上面看效果吧
See the Pen
Panoramic image container that automatically scrolls to the center of the image, a custom jQuery plugin. by VECTOR.cool 威得數位 (@ann71727)
on CodePen.
透過這篇技術分享，您學到了如何利用 jQuery 插件將全景圖片容器的滾動條自動定位至圖片中央。這不僅提升了用戶體驗，也為您的網站增添了一點小巧思。這種方法適用於各種需要強調視覺中心的場景，無論是圖片展示、產品介紹，還是其他創意應用。
[……]
jQuery on input value change event
CSS 選擇器，模糊查找匹配元素
CSS選擇器中沒有所謂的「萬用字元(*)」，可以透過一些方式接近模糊查詢方式，查找匹配屬性或值的元素
歸納出幾種用法
下表屬性名稱不一定為Class，可以替換成需要的屬性
單引號可有可無
[class]比對元素包含指定屬性[id][class][href] 比對元素包含其中一個屬性[class=’test’] 完全比對元素屬性與值 (區分大小寫)[class^=’test’]比對元素屬性開頭為指定的值[class$=’test’] 比對元素屬性結尾為指定的值 [class*=’test’] 模糊比對屬性包含指定的值
使用範例：
See the Pen
CSS 選擇器，模糊查找匹配元素 by VECTOR.cool (@ann71727)
on CodePen.
[……]
jQuery clone element and events
jQuery 一般情況下，利用 clone() 來複製元素，但是複製元素後，並沒有複製原本元素綁定的事件及數據，這點有點困擾，之前是在Clone之後，重新綁定事件，但這樣會變得很麻煩，也會讓程式碼變得很亂，在 jQuery 1.4 以後 clone() 加了一個貼心的功能，可以在複製的時候選擇要不要連事件及數據一起複製。
Demo 程式如下：
這是一個簡單的範例，在按鈕上綁定一個click事件，點擊按鈕開啟警告窗
這示例程式，當我們點擊 “Clone” 這按鈕，會複製一個上方的 “Click Me”按鈕，當我們點下新產生的 “Click Me”按鈕並沒有任何反應，代表並沒有複製到原本元素綁定的事件及數據。
See the Pen jQuery clone element by VECTOR.cool
(@ann71727) on CodePen.
接著我們看下方程式碼，用相同動作，原本的 “Click Me” 按鈕及新複製出的 “Click Me” 按鈕，都可以正常運行綁定事件，換而言之，事件成功被複製，如此就不用重新綁定，非常省事呢！
See the Pen jQuery clone element and events by VECTOR.cool
(@ann71727) on CodePen.
這兩段程式碼其中只差異在這一行
在 clone 中帶入 true，即代表複製綁定事件及數據，預設情況下是 false，詳細可參考 jQuery 的技術文件
[……]
jQuery javascript scroll to element
javascript 卷軸自動捲到某一元素
$('html, body').animate({
scrollTop: ele.offset().top - 110 + 'px'
}, 1500 ,'easeInOutQuint');[……]
jQuery 常用
$.param({
year: 2009,
country: "Canada"})
)$(this).attr('coords').split(',');
Convert an array to a string:
var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.toString();
The result of fruits will be:
Banana,Orange,Apple,Mango
[……]
jQuery 選擇器，替代萬用字元 模糊查找匹配元素
jQuery 選擇器中沒有所謂的「萬用字元(*)」，可以透過依些方式接近模糊查找元素或值的目的
歸納出幾種用法
下表屬性名稱不一定為Class，可以替換成需要的屬性
單引號可有可無
[class]比對元素包含指定屬性[id][class][href] 比對元素包含其中一個屬性[class=’test’] 完全比對元素屬性與值 (區分大小寫)[class^=’test’]比對元素屬性開頭為指定的值[class$=’test’] 比對元素屬性結尾為指定的值 [class*=’test’] 模糊比對屬性包含指定的值[class!=’test’]元素屬性不包含指定的值
使用範例：
Demo Download 範例下載：
[……]