Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
domql
Advanced tools
Readme
DOM rendering Javascript framework.
You can start with starter-kit as a boilerplate, or jump into the playground.
import DOM from 'domql'
DOM.create({ text: 'Rendered' })
var link = {
tag: 'a',
class: 'menu link',
attr: {
href: '#'
}
}
var img = {
tag: 'img',
class: 'avatar',
attr: {
src: '...'
}
}
var Link = {
tag: 'a'
}
var ListItem = {
extend: Link,
class: 'ui link',
attr: {
href: '#'
}
}
var menu = {
childExtend: ListItem,
home: 'Home',
text: 'About'
}
var header = {
logo: {},
menu
}
var navItems = ['Home', 'About', 'FAQ', 'Contact']
var menu = {
extend: ListItem,
...navItems
}
var val = {
text: 0
}
var Increment = {
tag: 'button',
text: 'Increment',
on: {
click: (e) => {
val.update({ text: val.text++ })
}
}
}
Property | Type | Description | Default |
---|---|---|---|
key | Number String | Defines the key of the Element | The key of the object, or randomly generated name |
extend | Object Array | Clones the other element | undefined |
childExtend | Object Array | Specifies the extend for all child elements | undefined |
tag | String | Specifis the HTML tag | div or related HTML tag if the key matches |
class | Any | Specifies the HTML class | undefined |
attr | Object | Specifies the set of HTML attributes | {} |
text | Any | Text inside the element | undefined |
content | Object Array | Fragment wrapper to use dynamic content loading | undefined |
To specify your own property per Element, set the function inside define
property like:
var User = {
define: {
username: param => param.toUpperCase()
},
text: element => element.username
}
var Contact = {
extend: User,
username: 'nikoloza'
}
Method | Description | Params |
---|---|---|
update | Updates element by passed object | properties : Object Array |
set | Sets passed element in the content property | element : Object Array |
All native DOM events are supported and can be specified inside on
parameter. Additionally, init
and render
can be also invoked. All events except these two receive event
object as a first parameter, following the element
object itself.
key
tag
node
extend
on
class
text
data
style
attr
update
set
define
Anything except these keywords will create a new nested child element. The easier method to specify HTML tag is to use related nodeName as a key, for example:
var layout = { // this will be <div>
header: {}, // will create <header>
aside: {}, // will create <aside>
main: { // will create <main>
childExtend: {
article: { // will create <article>
title: {}, // will create <div>
description: {}, // will create <div>
_rating: {} // will create <div class="rating">
}
}
},
footer: {} // will create <footer>
}
Inspired by brisky
FAQs
Unknown package
The npm package domql receives a total of 137 weekly downloads. As such, domql popularity was classified as not popular.
We found that domql demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.