$w( )
Selects and returns elements from a page.
Description
The $w()
function selects single or multiple elements by ID or type.
To select by ID, pass a selector string with the hash symbol
(#
) followed by the ID of the item you want to select (e.g. "#myElement"
).
The function returns the selected element object.
To select by type, pass a selector string with the name of
the type without the preceding #
(e.g. "Button"
). The function returns
an array of the selected element objects. An array is returned even if one
or no elements are selected.
To select using multiple selectors, pass a selector string with multiple selectors separated by commas. The selectors in the comma-separated string can be ID selectors, type selectors, or a mixture of the two. The function returns an array of the selected element objects. An array is returned even if one or no elements are selected. If two or more selectors select the same element, it's still returned only once in the array.
Note: Most elements accessible for selection by
$w
have basic API properties and functions, likeid
,type
,show()
,hide()
, and others. Use Velo's autocomplete in the code panel to see which API functions and properties are available for each element.
Syntax
function $w(selector: string): Element | Array<Element>
$w Parameters
NAME
TYPE
DESCRIPTION
A selector or multiple comma-separated selectors.
Was this helpful?
1let myElement = $w("#myElement");23let elementType = myElement.type; // "$w.Type"
1let typeElements = $w("Type");23let firstOfType = typeElements[0];
1let imageElements = $w("Image");23let firstImage = imageElements[0];
1let selected = $w("#myElement1, #myElement3, Type");
1$w("Image").hide();
This example shows how to use $w
to change an element's text when the page is loaded and when a button is clicked. You can test out the code in our example template.
1$w.onReady(function () {2 $w('#helloText').text = 'HELLO WORLD !'34 $w('#clickMeButton').onClick(() => {5 $w('#helloText').text = 'HELLO WIX !';6 });7});8