Question

我在WordPress网站上遇到了问题。当我在网站上包含jQuery时，插件将崩溃。这就是为什么我想包含简单的javascript代码。但是问题是我不知道它的Javascript等效项。

$(document).ready(function() {
  $('#sd').change(function() {
    var n = new Date(this.value);
    n.setDate(n.getDate() + 1);

    var day = ("0" + n.getDate()).slice(-2);
    var month = ("0" + (n.getMonth() + 1)).slice(-2);
    var today = n.getFullYear() + "-" + (month) + "-" + (day);
    $('#ed').attr('min', today);
  });
});

错误日志（wordpress）：

Uncaught TypeError: r.getClientRects is not a function
    at w.fn.init.offset (jquery-3.3.1.min.js:2)
    at Object.getWithinInfo (position.min.js?ver=1.11.4:11)
    at w.fn.init.a.fn.position (position.min.js?ver=1.11.4:11)
    at w.fn.init.reposition (pum-site-scripts.js?…263704&ver=1.7.29:7)
    at w.fn.init.e.fn.popmake (pum-site-scripts.js?…263704&ver=1.7.29:7)
    at w.fn.init.open (pum-site-scripts.js?…263704&ver=1.7.29:7)
    at w.fn.init.e.fn.popmake (pum-site-scripts.js?…263704&ver=1.7.29:7)
    at HTMLAnchorElement.<anonymous> (pum-site-scripts.js?…263704&ver=1.7.29:8)
    at HTMLDocument.dispatch (jquery-3.3.1.min.js:2)
    at HTMLDocument.y.handle (jquery-3.3.1.min.js:2)

Answer 1

与$(selector)等效的JS是document.querySelector(selector)或document.querySelectorAll(selector)，具体取决于您只想要第一个匹配项还是所有匹配项。在您的代码中，由于您要选择一个ID，因此只需要第一个匹配项即可。

添加事件处理程序的普通JS方法是.addEventListener。

与.attr()等效的是.setAttribute()。

其余代码是纯JS，而不是jQuery。

window.addEventListener("DOMContentReady", function() {
  document.querySelector("#sd").addEventListener("change", function() {
    var n = new Date(this.value);
    n.setDate(n.getDate() + 1);

    var day = ("0" + n.getDate()).slice(-2);
    var month = ("0" + (n.getMonth() + 1)).slice(-2);
    var today = n.getFullYear() + "-" + (month) + "-" + (day);
    document.querySelector("#ed").setAttribute('min', today);
  });
});

如何找到与jQuery代码等效的JavaScript？

1 个答案: