從函數獲取數據屬性

Question

我正在嘗試從我的函數中獲取data-io屬性。

<input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">

onChange: function(selectedDates, time, instance){

使用此代碼，我可以將輸入ID扔給： instance.input.id
但是我不知道如何訪問data-io屬性。

我試過了：

instance.input.data-io
instance.input.data('io')
instance.input.attr('data-io')
instance.input.attr('io')

我應該怎么做？

Answer 1

使用instance.input.dataset.io 。 有關data- *屬性的更多信息，請參見： https : //developer.mozilla.org/zh-CN/docs/Learn/HTML/Howto/Use_data_attributes

Answer 2

由於使用jQuery使用data-api：

$('#42297').data('io'); // -> in

請記住， id應該以字母開頭。

---

如果您的instance.input是JS對象，請將其轉換為jQuery： $(instance.input).data('io')

Answer 3

如果您正在使用jquery，請使用.data('io')或attr('data-io') 。 如果使用香草js，請使用Element.getAttribute（） 。

 var inp = document.getElementById('42297'); console.log(inp.getAttribute('data-io')); var $inp = $('#42297'); console.log($inp.data('io')); console.log($inp.attr('data-io')); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="42297" class="edit flatpickr-input active" data-io="in" value="14:23" type="text" readonly="readonly">