jQuery 3.7.0では新たに6つのプロパティが自動px付与になる

2023年5月11日にjQuery 3.7.0がリリース

2023年5月11日にjQuery 3.7.0がリリースされました。

jQuery 3.7.0から新たに単位なしで補完されるプロパティが6つ追加されました。

単位なしプロパティとは

単位なしプロパティ (Unitless CSS properties) とはjQueryで.CSS()メソッドを使用する際に数値が単位なしの場合は単位を補完する機能です。

例えばJavaScript内に以下のようなコードがあったとします。

$('.box').css('border-radius', 10)

上記のコードはpxや%などの単位がない場合はpxなどの単位を自動的に補完します。

つまり、border-radius: 10px; を指定しているのと同じ意味になります。

jQuery 3.7.0で単位を自動的に補完するCSSプロパティは以下の通りです。

太字は新規に対応された8つのプロパティになります。

aspect-ratioの場合は $(".box").css("aspect-ratio", 5); のように指定すると、aspect-ratio: 5 / 1; のように補完されます。

$('.box').css('aspect-ratio', '5')

ただし、1 / 5 の記述ミスの可能性もあり、まぎらわしいので aspect-ratioを省略して指定するのは避けたほうが良いでしょう。