feat: allow data attributes for sDOM

[daniel-prause]

In our company, we'd like to have the ability to add data attributes to the dom elements of our data tables. Unfortunately, there is only the option for adding classes and/or ids.
This PR attempts to change it. Feel free to post possible upcoming problems since I'm not super familiar with the extension of the DataTables code.

[AllanJard]

Very nice! Even some tests - awesome!

I'm not going to pull it in just yet - but if I make a 1.14 release, I'll pull it in for that.

The reason I'm not immediately going to pull it in is that I'm actually going to replace the dom option with a new layout option in DataTables 2, which I expect to be the next major release. As such, I'm reluctant to add new features to the dom property, particularly in a patch release. As I say though, if there is a 1.14, I'll include it in that (I've been saying that "this" is that last 1.x since 1.10...0.

[daniel-prause]

@AllanJard Thank you for your kind and fast response! I'm glad, if could be of any assistance to you 😃 !

I truly believe that it will be pretty hard to "get rid" of DataTables version 1.x any time soon though, since this library is the most distributed data tables library that I know of.

Would you kindly (Bioshock TM) give me a short insight into on how you plan to implement the new layout instead of the old dom syntax?

Regarding DataTables v2, maybe we could use the idea of the mechanism here in this PR in a more sophisticated way 🤔 (but you might have taken this already into account, like e.g. that one will be able to add things like data attributes or else).

If I was to make an educated guess here, my guess would be that v2 will be a complete rewrite (?). That would be a great opportunity to "get rid" of the "old" js code! 😃

[AllanJard]

layout for 2 is actually already written :) . This is the code and the idea is that you can do things without specifying DOM elements - rather you use the position you want:

layout: {
  topLeft: 'pageLength'
  topRight: 'info',
  bottomLeft: new DataTables.Buttons( ... )
}

You can do multiple rows as well:

layout: {
  top2Right: myDiv,
  top1Right: 'buttons',
  ...
}

The problem with the dom property is that there is no seperation between the position on the page and the styling framework used. So Bootstrap, Bulma, etc, all need to use different code for initialisation. With layout I want to end that issue.

If I was to make an educated guess here, my guess would be that v2 will be a complete rewrite

As much as I would like that to be the case, I think it would probably never be released if that was the case! It could do with a rewrite, and I am going to transition it to a new build process, and slowly start updating parts - but it isn't going to be done in one fell swoop.

[daniel-prause]

Awesome! Thx for the reference to the layout source code :)! Yeah, probably DataTables v2 as a rewrite might take quite some time. Btw - since browsers are much more "sophisticated" than 10 years ago - would it be an option to use a more native approach e.g. document.querySelector instead of having jQuery as a dependency?

[AllanJard]

With the exception of events, then yes - as it is something that keeps coming up. My view at the moment is that I would just need to reimplement a fair bit of jQuery (not all by any means, but still a fair amount) which increases the support burden on me for DataTables and well as taking more time away from work on other features, or I could just continue to use jQuery off the shelf.

It does come up a lot though, and maybe I should invest the time in it. I use the event system in jQuery quite deeply (the name spaces specifically) so that would be the key reimplementation details. Using something like Cash I think is a more attractive option though.