wpseek.com
A WordPress-centric search engine for devs and theme authors



wp_js_dataset_name › WordPress Function

Since6.9.0
Deprecatedn/a
wp_js_dataset_name ( $html_attribute_name )
Parameters:
  • (string) $html_attribute_name Raw attribute name as found in the source HTML.
    Required: Yes
See:
Returns:
  • (string|null) Transformed `dataset` name, if interpretable as a custom data attribute, else `null`.
Defined at:
Codex:

Return the corresponding JavaScript `dataset` name for an attribute if it represents a custom data attribute, or `null` if not.

Custom data attributes appear in an element's dataset property in a browser, but there's a specific way the names are translated from HTML into JavaScript. This function indicates how the name would appear in JavaScript if a browser would recognize it as a custom data attribute. Example: // Dash-letter pairs turn into capital letters. 'postId' === wp_js_dataset_name( 'data-post-id' ); 'Before' === wp_js_dataset_name( 'data--before' ); '-One--Two---' === wp_js_dataset_name( 'data---one---two---' ); // Not every attribute name will be interpreted as a custom data attribute. null === wp_js_dataset_name( 'post-id' ); null === wp_js_dataset_name( 'data' ); // Some very surprising names will; for example, a property whose name is the empty string. '' === wp_js_dataset_name( 'data-' ); 0 === strlen( wp_js_dataset_name( 'data-' ) );


Source

function wp_js_dataset_name( string $html_attribute_name ): ?string {
	if ( 0 !== substr_compare( $html_attribute_name, 'data-', 0, 5, true ) ) {
		return null;
	}

	$end = strlen( $html_attribute_name );

	/*
	 * If it contains characters which would end the attribute name parsing then
	 * something else is wrong and this contains more than just an attribute name.
	 */
	if ( ( $end - 5 ) !== strcspn( $html_attribute_name, "=/> \t\f\r\n", 5 ) ) {
		return null;
	}

	/**
	 * > For each name in list, for each U+002D HYPHEN-MINUS character (-)
	 * > in the name that is followed by an ASCII lower alpha, remove the
	 * > U+002D HYPHEN-MINUS character (-) and replace the character that
	 * > followed it by the same character converted to ASCII uppercase.
	 *
	 * @see https://html.spec.whatwg.org/#concept-domstringmap-pairs
	 */
	$custom_name = '';
	$at          = 5;
	$was_at      = $at;

	while ( $at < $end ) {
		$next_dash_at = strpos( $html_attribute_name, '-', $at );
		if ( false === $next_dash_at || $next_dash_at === $end - 1 ) {
			break;
		}

		// Transform `-a` to `A`, for example.
		$c = $html_attribute_name[ $next_dash_at + 1 ];
		if ( ( $c >= 'A' && $c <= 'Z' ) || ( $c >= 'a' && $c <= 'z' ) ) {
			$prefix       = substr( $html_attribute_name, $was_at, $next_dash_at - $was_at );
			$custom_name .= strtolower( $prefix );
			$custom_name .= strtoupper( $c );
			$at           = $next_dash_at + 2;
			$was_at       = $at;
			continue;
		}

		$at = $next_dash_at + 1;
	}

	// If nothing has been added it means there are no dash-letter pairs; return the name as-is.
	return '' === $custom_name
		? strtolower( substr( $html_attribute_name, 5 ) )
		: ( $custom_name . strtolower( substr( $html_attribute_name, $was_at ) ) );
}