Search code examples
javascripttriggers

what is different between custom event by colon vs dot


i try JavaScript and jQuery (i know jQuery is old but it is just for learning), i create a tools and i need activate some functions by triggered events, this is easy but the problem is custom event names and i don't know what is different between this 4 lines:

1: test.run

2: test:run

3: run.test

4: run:test

question A: they are same?

question B: what is different?

question C: which one is better to used?

question D: if i trigger "run" without "test" which one is triggered?

(for example name space is "test" and event name is "run")


Solution

  • A: They are not the same.

    B: "test:run" has no special meaning. According to the docs:

    You can use any name for a custom event, however you should beware of creating new events with names that might be used by future DOM events. For this reason, in this article we have chosen to use light: for all of our event names, as events with colons are unlikely to be used by a future DOM spec.

    "test.run", on the other hand, consists of jQuery's concept of namespaces, which are not present in native JS events. It comes under the root event "test", so if you fire the event "test", anything under the namespace "test" will be fired as well, including "test.run" or "test.run.somethingelse". If you fire the event "test.run", however, only "test.run" will be fired, as well as its sub-events.

    C: There's not necessarily a better one, just one is used for special purposes, i.e. namespaces.

    D: Apparently spaces is another way to write namespaces instead of using dots.