-
Notifications
You must be signed in to change notification settings - Fork 3
BBScript: BBScript 2: DOM Manipulation
These are functions that allow for DOM manipulation. Many who are familiar with Javascript or the JQuery library will recognize these functions.
All of these have an optional target
parameter. This is the selector for determining the target of the action. If the parameter is not provided, it will use the element that triggered the script action. If there is no such element, then the function will not do anything.
If a target is provided, it must resolve to a string, and will be treated as the class name selector of the intended target. It will target all elements with the given class name.
As an example, the following script will add the class .foo
to all elements with the class .bar
(addClass "foo" "bar")
Adds a class to the target.
(addClass className target)
className : The name of the class to be added to the target. Must be a string or resolve to a string.
target optional : If provided, will add defined class name to all elements matching the provided class selector. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Removes a class from the target.
(removeClass className target)
className : The name of the class to be removed from the target. Must be a string or resolve to a string.
target optional : If provided, will remove defined class name from all elements matching the provided class selector. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Attempt to scroll until the element is within the viewport. See MDN: scrollIntoView().
(scrollIntoView target)
target optional : The target to scroll into view. : Default - If not provided, will target the element that triggered the script action.
Fades in the target over an optional amount of time in milliseconds
(fadeIn duration target)
duration optional
: The duration of the fade in animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Fades out the target over an optional amount of time in milliseconds
(fadeOut duration target)
duration optional
: The duration of the fade out animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Fades out or fades in the target over an optional amount of time in milliseconds. Toggle is based on the current state of the element.
(fadeToggle duration target)
duration optional
: The duration of the fade out/in animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Hide the target from view.
(hide target)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Shows the target.
(show target)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Display the target with a sliding motion.
(slideDown duration target)
duration optional
: The duration of the slide down animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Hides the target with a sliding motion.
(slideUp duration target)
duration optional
: The duration of the slide up animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Hides/Shows the target with a sliding motion.
(slideToggle duration target)
duration optional
: The duration of the slide up/down animation in miliseconds (1/1000 seconds). Must resolve to a number
: Default - If not provided, will default to 1000
(1 second)
target optional : If provided, perform the animation on elements matching the class name. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Get the plain text content of the target.
(getText target)
target optional : If provided, will get the text content of the all elements matching the selector in a combined string. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Sets the plain text content of the target to the provided text.
(setText text target)
text : The plain text string to replace the content in the target. Must be a string or resolve to a string.
target optional : If provided, will set the text content of the all elements matching the selector. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Appends a div inside the target and adds the supplied class names to it.
(addDiv className target)
className : A single string or array of strings containing the name of the class to be supplied to the new div. : Can be empty.
target optional : If provided, will append a div with the given class names to all elements matching the selector. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.
Removes elements inside the target that match the supplied class names.
(removeDiv className target)
className : A single string or array of strings containing the name of the class matching the element to be removed.
target optional : If provided, will remove the element with the given class names from all elements matching the selector. Must be a string or resolve to a string. : Default - If not provided, will target the element that triggered the script action.