https://github.com/hypersoftllc/qc-attach-node
Allow easy attachment of a Node or Element to another Node or Element
https://github.com/hypersoftllc/qc-attach-node
Last synced: 11 months ago
JSON representation
Allow easy attachment of a Node or Element to another Node or Element
- Host: GitHub
- URL: https://github.com/hypersoftllc/qc-attach-node
- Owner: hypersoftllc
- License: isc
- Created: 2020-03-14T04:14:45.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-03-15T01:19:23.000Z (over 6 years ago)
- Last Synced: 2025-08-08T21:23:03.325Z (12 months ago)
- Language: JavaScript
- Size: 8.79 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# @qc/attach-node
Allows easy attachment of a `Node` or an `Element` instance to another `Node` instance or an `Element` instance.
## Syntax
```typescript
type CssSelector = string;
type NodeLike = CssSelector | Node;
type AttachAction = 'after' | 'before' | 'endof' | 'startof';
type AttachableString = AttachAction + '@' + CssSelector;
interface AttachableObject {
[AttachAction]: NodeLike;
}
type Attachable = AttachableString | AttachableObject;
declare function attachNode (node: Node, attachable: Attachable | Attachable[]): void;
```
## Examples
```js
import attachNode from 'attach-node'
const someNode = ... // Get a reference to some node somehow.
// Using {action}@{css-selector} Syntax:
attachNode(someNode, 'startof@body')
attachNode(someNode, 'endof@body')
attachNode(someNode, 'before@.app')
attachNode(someNode, 'after@.app')
// Using Object Syntax with CSS Selector:
attachNode(someNode, { startof: 'body' })
attachNode(someNode, { endof: 'body' })
attachNode(someNode, { before: '.app' })
attachNode(someNode, { after: '.app' })
const otherNode = ... // Get a reference to some other node.
// Using Object Syntax with Node Instance:
attachNode(someNode, { startof: otherNode })
attachNode(someNode, { endof: otherNode })
attachNode(someNode, { before: otherNode })
attachNode(someNode, { after: otherNode })
// With Fallbacks:
// The first "attachable" that matches to an existing Node instance wins.
attachNode(someNode, [
'before@.foo > .bar',
{ startof: otherNode },
'endof@body',
])
```