freeze-element

The freeze-element freezes a DOM element, thereby preventing new nodes from being adding inside the element.
Parameters
Name
Description
Example
Mandatory
property
The CSS selector for the parent element that you want to freeze.
​
​
'.left-content .container'
Yes
options
A single parameter for snippet options. A string containing all the options you want to pass, each of them separated by a plus character (+), and empty single quotes if none ('').
​
Available options:
​
subtree (if you want to freeze all the element's children as well)
abort (throws an error every time a child element gets added)
'' or subtree or abort or subtree+abort etc.
No
exceptions
An array of regular expressions/selectors used to specify the nodes you don't want to prevent being added. 
​
Each array item can be:
​
A selector (targeting element nodes) 
Regex (targeting text nodes, identified by slash)
.article #banner .navigation /.*/
No
Filter examples
The following table lists examples that use the abort-on-property-write snippet:
Filter
Result
freeze-element ol#b_results
Any addition of an immediate child to the ol#b_results element will be blocked.
freeze-element ol#b_results subtree
Any addition of a node to the entire subtree of ol#b_results element will be blocked.
freeze-element ol#b_results '' .organic-result
Any addition of an immediate child to the ol#b_results element will be blocked, except for the elements with the organic-result class.
freeze-element ol#b_results '' .organic-result /hello/
Any addition of an immediate child to the ol#b_results element will be blocked, except for the elements with the organic-result class and the text nodes that match the /hello/ regex.
freeze-element ol#b_results '' .organic-result /.*/
Any addition of an immediate child to the ol#b_results element will be blocked, except for the elements with the organic-result class and any Text node.
freeze-element ol#b_results '' .organic-result #header
Any addition of an immediate child to the ol#b_results element will be blocked, except for the elements with the organic-result class or the id of header.
freeze-element ol#b_results subtree .organic-result #header
Any addition of a node to the entire subtree of ol#b_results element will be blocked, except for the elements with the organic-result class or the id of header.
freeze-element ol#b_results abort
Any addition of an immediate child to the ol#b_results element will throw an error.
freeze-element ol#b_results abort+subtree
Any addition of a node to the entire subtree of ol#b_results element throw an error.
freeze-element ol#b_results abort+subtree .organic-result
Any addition of a node to the entire subtree of ol#b_results element will throw an error, except for the elements with the organic-result class.
Debugging
During debugging, you'll see messages in your browser's Developer Console of the browser for every attempt to add a child node inside the frozen element.
As a result, the elements will be added to the frozen parent node, but they won't be visible as the CSS property display: none is added.
For all the DOM mutation properties apart from textContent, innerText and nodeValue, the structure of the message is the following (each line in the table is a line printed to the console):
Message
Structure
Explanation
Examples
title
[freeze][changeId] action: selector
changeId - the # of the attempt
action - aborting/watching
selector - the first argument of the snippet
[freeze][0] watching: ol#b_results
[freeze][1] aborting: ol#b_results
property used
[freeze][changeId] using the function: "property"
changeId - the # of the attempt
property - the DOM mutation property used
[freeze][0] added the function: "innerHTML"
parent node
[freeze][changeId] added to node: parentNode
changeId - the # of the attempt
parentNode - the parent node where the added node attempts to be inserted
[freeze][0] added to node: <div id='parent'></div>
added node
[freeze][changeId] node: addedNode
changeId - the # of the attempt
addedNode - the blocked node
[freeze][0] node: <div class='ad'>ad</div>
For textContent, innerText and nodeValue, the structure of the message is the following (each line in the table is a line printed to the console):
Message
Structure
Explanation
Examples
title
[freeze][changeId] action: selector
changeId - the # of the attempt
action - aborting/watching
selector - the first argument of the snippet
[freeze][0] watching: ol#b_results
[freeze][1] aborting: ol#b_results
parent node
[freeze][changeId] content of node: parentNode


changeId - the # of the attempt
parentNode - the parent node where the added node attempts to be inserted
[freeze][0] content of node: <div id='parent'>child</div>
new content
[freeze][changeId] changed to: newContent


changeId - the # of the attempt
newContent - the new content for the parent node
[freeze][0] changed to: text add
property used
[freeze][changeId] using the function: "property"
changeId - the # of the attempt
property - the DOM mutation property used
[freeze][0] added the function: "textContent"
Considerations
Keep the following in mind when you use the freeze-elementsnippet:
Logging is more reliable than highlighting. Sometimes, some elements don't show as highlighted even if their style has the correct rules.
Sometimes, when you hover on addedNode in the console, the added node is not highlighted on the page as it should be. That is because for some DOM mutation properties, like innerHTML, outerHTML or insertAdjacentHTML, the element loses its reference when it gets added. 
When you see all the elements of a parent node highlighted/logged, that doesn't necessarily mean nothing was there to begin with. That's because of how innerHTML and outerHTML work: changing these properties of an element results in overriding the content. When you see all the children highlighted, then, it could be because innerHTML or outerHTML was used.

Name	Description	Example	Mandatory
property	The CSS selector for the parent element that you want to freeze.	`'.left-content .container'`	Yes
options	A single parameter for snippet options. A string containing all the options you want to pass, each of them separated by a plus character (+), and empty single quotes if none (''). Available options: subtree (if you want to freeze all the element's children as well) abort (throws an error every time a child element gets added)	`'' or subtree or abort or subtree+abort etc.`	No
exceptions	An array of regular expressions/selectors used to specify the nodes you don't want to prevent being added. Each array item can be: A selector (targeting element nodes) Regex (targeting text nodes, identified by slash)	`.article #banner .navigation /.*/`	No

Filter	Result
`freeze-element ol#b_results`	Any addition of an immediate child to the `ol#b_results` element will be blocked.
`freeze-element ol#b_results subtree`	Any addition of a node to the entire subtree of `ol#b_results` element will be blocked.
`freeze-element ol#b_results '' .organic-result`	Any addition of an immediate child to the `ol#b_results` element will be blocked, except for the elements with the `organic-result` class.
`freeze-element ol#b_results '' .organic-result /hello/`	Any addition of an immediate child to the `ol#b_results` element will be blocked, except for the elements with the `organic-result` class and the text nodes that match the `/hello/` regex.
`freeze-element ol#b_results '' .organic-result /.*/`	Any addition of an immediate child to the `ol#b_results` element will be blocked, except for the elements with the `organic-result` class and any Text node.
`freeze-element ol#b_results '' .organic-result #header`	Any addition of an immediate child to the `ol#b_results` element will be blocked, except for the elements with the `organic-result` class or the id of `header`.
`freeze-element ol#b_results subtree .organic-result #header`	Any addition of a node to the entire subtree of `ol#b_results` element will be blocked, except for the elements with the `organic-result` class or the id of `header`.
`freeze-element ol#b_results abort`	Any addition of an immediate child to the `ol#b_results` element will throw an error.
`freeze-element ol#b_results abort+subtree`	Any addition of a node to the entire subtree of `ol#b_results` element throw an error.
`freeze-element ol#b_results abort+subtree .organic-result`	Any addition of a node to the entire subtree of `ol#b_results` element will throw an error, except for the elements with the `organic-result` class.

Message	Structure	Explanation	Examples
title	`[freeze][``changeId``]` `action``:` `selector`	changeId - the # of the attempt action - aborting/watching selector - the first argument of the snippet	`[freeze][0] watching: ol#b_results` `[freeze][1] aborting: ol#b_results`
property used	`[freeze][``changeId``] using the function: "``property``"`	changeId - the # of the attempt `property` - the DOM mutation property used	`[freeze][0] added the function: "innerHTML"`
parent node	`[freeze][``changeId``] added to node:` `parentNode`	changeId - the # of the attempt `parentNode` - the parent node where the added node attempts to be inserted	`[freeze][0] added to node: <div id='parent'></div>`
added node	`[freeze][``changeId``] node:` `addedNode`	changeId - the # of the attempt `addedNode` - the blocked node	`[freeze][0] node: <div class='ad'>ad</div>`

Message	Structure	Explanation	Examples
title	`[freeze][``changeId``]` `action``:` `selector`	changeId - the # of the attempt action - aborting/watching selector - the first argument of the snippet	`[freeze][0] watching: ol#b_results` `[freeze][1] aborting: ol#b_results`
parent node	[freeze][changeId] content of node: parentNode	changeId - the # of the attempt `parentNode` - the parent node where the added node attempts to be inserted	`[freeze][0] content of node: <div id='parent'>child</div>`
new content	[freeze][changeId] changed to: newContent	changeId - the # of the attempt `newContent` - the new content for the parent node	`[freeze][0] changed to: text add`
property used	`[freeze][``changeId``] using the function: "``property``"`	changeId - the # of the attempt `property` - the DOM mutation property used	`[freeze][0] added the function: "textContent"`

cookie-remover

json-override

Last modified 3mo ago