property-information

What is property-information?

The property-information npm package provides utilities for working with HTML and SVG properties, attributes, and their corresponding information. It helps in understanding the relationships between properties and attributes, and how they should be used in the context of HTML and SVG elements.

What are property-information's main functionalities?

Get Property Information

This feature allows you to retrieve detailed information about a specific property or attribute. In this example, we are fetching information about the 'className' property.

const propertyInformation = require('property-information');
const info = propertyInformation.find('className');
console.log(info);

Check if Property is Boolean

This feature helps you determine if a property is a boolean attribute. In this example, we check if the 'checked' property is a boolean.

const propertyInformation = require('property-information');
const isBoolean = propertyInformation.boolean.includes('checked');
console.log(isBoolean);

Get All Properties for a Specific Element

This feature provides all properties and attributes for HTML elements. In this example, we retrieve all properties related to HTML elements.

const propertyInformation = require('property-information');
const properties = propertyInformation.html;
console.log(properties);

Other packages similar to property-information

html-element-attributes

The html-element-attributes package provides a comprehensive list of HTML element attributes and their corresponding information. It is similar to property-information but focuses solely on HTML attributes without SVG support.

html-attributes

The html-attributes package offers a list of standard HTML attributes and their details. It is similar to property-information but does not provide as detailed information about the relationships between properties and attributes.

svg-element-attributes

The svg-element-attributes package provides information about SVG element attributes. It is similar to property-information but focuses exclusively on SVG attributes.

README

property-information

Information for HTML properties.

Installation

npm:

npm install property-information

property-information is also available for bower, duo, and for AMD, CommonJS, and globals (uncompressed and compressed).

Usage

console.log(propertyInformation('itemScope'));

Yields:

{
  "name": "class",
  "propertyName": "className",
  "mustUseAttribute": true,
  "mustUseProperty": false,
  "boolean": false,
  "overloadedBoolean": false,
  "numeric": false,
  "positiveNumeric": false
}

API

propertyInformation(name)

Get information for a DOM property.

Parameters:

• name (string) — Case-insensitive name.

Returns: Information? — Information, when available.

propertyInformation.all

Object mapping case-insensitive names to Information objects. This gives raw access to the information returned by propertyInformation(): do not change the objects.

Information

Properties:

• name (string) — Case-insensitive name;

• propertyName (string) — Case-sensitive IDL attribute (e.g., a class attribute is added in HTML and a className is added in Web IDL);

• mustUseAttribute (boolean) — Whether setAttribute must be used when patching a DOM node;

• mustUseProperty (boolean) — Whether node[propertyName] must be used when patching a DOM node;

• boolean (boolean) — Whether the value of the property is boolean;

• overloadedBoolean (boolean) — Whether the value of the property can be boolean;

• numeric (boolean) — Whether the value of the property is number;

• positiveNumeric (boolean) — Whether the value of the property is number and positive;

License

MIT © Titus Wormer

Derivative work based on React licensed under BSD-3-Clause-Clear, © 2013-2015, Facebook, Inc.