DynamicBlock
appendTo?: string;
detectChanges?: boolean | ChangeDetection[];
idAttribute?: string;
idFunction?: ElementToIdFunction;
insertBefore?: string;
isMainBlock?: boolean;
merge?: false | MergeFunction;
mergeFunction?: MergeFunction;
removeIfMissing?: boolean;
selector: string;
}
Index
Properties
Properties
Optional
append To
Specifies a CSS selector that is used to find an element of the local document to which to append the dynamic block that exists only in the remote document.
Optional
detect Changes
Provides the possibility to define a list of ChangeDetection, to inspect the cached version
and the origin version of the current block for differences. In case the option is set to true
a
default change detection will be executed, which consists of inspecting all image tags within the
block and comparing their src
attribute and inspecting all anchor tags within the block and comparing
their href
attribute.
Optional
id Attribute
The HTML tag attribute to get a unique ID for this block from.
With this property the Dynamic Fetcher receives the HTML attribute's name to get the unique block ID of this dynamic block's HTML element.
Each dynamic block needs a unique ID in order to be replaced with the right content. This tag attribute is where the Dynamic Fetcher can find this ID. You can use a data attribute or just element IDs for example.
If a dynamic block has no such attribute and you cannot add them, you can use a function to generate a unique ID from the dynamic block as an input value. See therefore the idFunction property.
Note: This property is overriden by the idFunction property.
By default, the ID is taken from either DynamicBlockConfig.defaultIdFunction or DynamicBlockConfig.defaultIdAttribute.
Optional
id Function
The function to get a unique ID from this dynamic block.
Each dynamic block needs a unique ID in order to be replaced with the right content. This function should return a unique ID which the Dynamic Fetcher can use. The function receives the HTML element as parameter and returns a string.
If no idFunction is given, Speed Kit will use the idAttribute.
Note: This property overrides the idAttribute property.
Parameter | Description |
---|---|
element | The dynamic block to get the ID from. |
By default, the ID is taken from either DynamicBlockConfig.defaultIdFunction or DynamicBlockConfig.defaultIdAttribute.
Optional
insert Before
Specifies a CSS selector that is used to find an element of the local document before which the dynamic block should be inserted that exists only in the remote document.
The dynamic block will be inserted right before the element found by the selector.
Optional
is Main Block
Specifies if the dynamic block is the main block or not.
Optional
merge
A function to merge this downloaded block of dynamic content into the DOM.
Either defines a custom function to merge the dynamic content for this block
loaded from the origin into its cached counterpart or ist set to false
which
means the defined block will not be merged.
Parameter | Description |
---|---|
localBlock | The dynamic block from the current DOM (the cached version of the site). |
remoteBlock | The corresponding dynamic loaded from the origin (personalized version of the site). |
By default, the merge function is taken from DynamicBlockConfig.defaultMergeFunction.
Optional
merge Function
A function to merge this downloaded block of dynamic content into the DOM.
Deprecated
use merge instead
Optional
remove If Missing
Whether to remove a dynamic block that is only present in the cached version of the site.
A common example for this is a cookie banner that is always present in the anonymous cached version, but is missing in the origin version once the user has accepted the cookie terms.
selector
The CSS Selector to identify this dynamic block.
You can use any valid CSS Selector. Please ensure to use a unique selector for each block.
A dynamic block defines an area of dynamic content within the HTML.
Since
1.15.0