4 ms·

With $(el).next() you _can_ specify the next "what" if you chose, i.e $(el).next('span'). Otherwise it's next sibling, sort of how it appears. `Why is this a f

With $(el).next() you _can_ specify the next "what" if you chose, i.e $(el).next('span'). Otherwise it's next sibling, sort of how it appears. `Why is this a function and not a property of the object?` 1)Who cares? 2)Possibly because it's more than just getNextSibling as example above shows. So shorter syntax, more functionality, what's the fuss? 30kb?

ehnto 7y ago
element.querySelector('span') is the equivalent. Just as elegant, one fewer function call. 1) People like me care obviously. It's all bike-shedding anyway, so it's just a point of discussion. 2) nextSibling and nextElementSibling are two different properties, and you can't do the former in jQuery at all. In a typical usage you would need to do $('.my-class')[0].nextSibling, or in other words, dig down to the native DOM API anyway. So less functionality, less clear syntax, 30kb!
- dmitriid 7y ago
  1. Significantly more functionality than a few edge cases you can no doubt come up with 2. Significantly improved developer experience. 10x reduction in boilerplate === less bugs. 3. Why not improve DX in the platform APIs?
  - ehnto 7y ago
    Perhaps that's where the impasse is, because I see the platform APIs to have a reasonable experience now. I much prefer the browser implementations most of the time. Except drag and drop and Ajax. Those are terrible. I also preferred PrototypeJS over jQuery, it's approach of extending objects made way more sense than a god object that wrapped itself around my existing objects. I have simply never liked jQuery's approach or API.
    - dmitriid 7y ago
      > Except drag and drop and Ajax. Those are terrible. And except actual DOM manipulation which is tedious, error-prone, and requires tons of boilerplate. > I also preferred PrototypeJS over jQuery, its approach of extending objects made way more sense than a god object that wrapped itself around my existing objects. Prototype extended global objects which made them even more magic and would break vanilla JS. jQuery creates a wrapper object with well-defined methods and lets you access the actual unaltered underlying DOM object. And their resulting APIs are not that different // Prototype $('comments').addClassName('active').show() // jQuery $('#comments').addClass('active').show()
- mythrwy 7y ago
  element.querySelector('span') would work from parent but not sibling as $(element).next('span') does. You could certainly use that if you selected the parent, then did querySelector from parent (which for all I know is how $(el).next('span') works). So not equivalent, it's an extra step. And that's kind of the point I think. Instead of writing this stuff (with much longer syntax) over and over again, jQuery might be better for casual web dev. Still. In 2019. But whatever works for you. If you don't like it cool.
  - ehnto 7y ago
    Yeah in JS that would be element.parentNode.querySelector('span'). I guess to me, that's not a bad thing. Verbosity is good, it's clear what's happening which leads to fewer unexpected outcomes. What I have learned from this thread is that people don't really like the native versions of these kinds of things, whereas I think the above is much cleaner. It's not my place to say one is correct and one is false, and the popularity of jQuery speaks for itself. I am just one point of view.
    - maple3142 7y ago
      It is not a equivalent to $(el).next('span') . Your code means selecting the first span in the parent of current element, while the jQuery one means the first span after current element. It will produce different result when there are a span before current element.

ehnto 7y ago

element.querySelector('span') is the equivalent. Just as elegant, one fewer function call. 1) People like me care obviously. It's all bike-shedding anyway, so it's just a point of discussion. 2) nextSibling and nextElementSibling are two different properties, and you can't do the former in jQuery at all. In a typical usage you would need to do $('.my-class')[0].nextSibling, or in other words, dig down to the native DOM API anyway. So less functionality, less clear syntax, 30kb!

dmitriid 7y ago
1. Significantly more functionality than a few edge cases you can no doubt come up with 2. Significantly improved developer experience. 10x reduction in boilerplate === less bugs. 3. Why not improve DX in the platform APIs?
- ehnto 7y ago
  Perhaps that's where the impasse is, because I see the platform APIs to have a reasonable experience now. I much prefer the browser implementations most of the time. Except drag and drop and Ajax. Those are terrible. I also preferred PrototypeJS over jQuery, it's approach of extending objects made way more sense than a god object that wrapped itself around my existing objects. I have simply never liked jQuery's approach or API.
  - dmitriid 7y ago
    > Except drag and drop and Ajax. Those are terrible. And except actual DOM manipulation which is tedious, error-prone, and requires tons of boilerplate. > I also preferred PrototypeJS over jQuery, its approach of extending objects made way more sense than a god object that wrapped itself around my existing objects. Prototype extended global objects which made them even more magic and would break vanilla JS. jQuery creates a wrapper object with well-defined methods and lets you access the actual unaltered underlying DOM object. And their resulting APIs are not that different // Prototype $('comments').addClassName('active').show() // jQuery $('#comments').addClass('active').show()
mythrwy 7y ago
element.querySelector('span') would work from parent but not sibling as $(element).next('span') does. You could certainly use that if you selected the parent, then did querySelector from parent (which for all I know is how $(el).next('span') works). So not equivalent, it's an extra step. And that's kind of the point I think. Instead of writing this stuff (with much longer syntax) over and over again, jQuery might be better for casual web dev. Still. In 2019. But whatever works for you. If you don't like it cool.
- ehnto 7y ago
  Yeah in JS that would be element.parentNode.querySelector('span'). I guess to me, that's not a bad thing. Verbosity is good, it's clear what's happening which leads to fewer unexpected outcomes. What I have learned from this thread is that people don't really like the native versions of these kinds of things, whereas I think the above is much cleaner. It's not my place to say one is correct and one is false, and the popularity of jQuery speaks for itself. I am just one point of view.
  - maple3142 7y ago
    It is not a equivalent to $(el).next('span') . Your code means selecting the first span in the parent of current element, while the jQuery one means the first span after current element. It will produce different result when there are a span before current element.