將jQuery $ .extend轉換為純JavaScript

Question

我正在嘗試取消jQuery，因為我只需要很少的東西，而是使用純JavaScript

我有這個原始代碼：

this.bar = el.find('.bar');
this.options = $.extend({
    delay: $.toInt(el.data('delay')) || 2000
}, options);

我試圖用它來轉換它：

function foo(el, options) {

    ..................

    this.bar = el.querySelectorAll(".bar");
    this.options = extend({
        delay: parseInt(el.data('delay')) || 2000 < -- - problem
    }, options);
}

---

function extend(first, second) {
    for (var secondProp in second) {
        var secondVal = second[secondProp];
        if (secondVal && Object.prototype.toString.call(secondVal) === "[object Object]") {
            first[secondProp] = first[secondProp] || {};
            extend(first[secondProp], secondVal);
        } else {
            first[secondProp] = secondVal;
        }
    }
    return first;
};

---

但我收到此錯誤：

“未捕獲的TypeError：el.data不是函數”

有人對如何解決有任何想法嗎？

Answer 1

el是DOM對象引用，它不是jQuery對象，因此您不能在其上調用jQuery方法。

要在VanillaJS中獲取data-*屬性值，可以使用dataset 。

采用

el.dataset.delay

如果要使用jQuery方法，可以將元素引用包裝在jQuery中

$(el).data('delay')