js Clip's whimsical text splicing effect_javascript skills

So someone asked, what CSS effects are both wonderful and practical? Clip, yes, it is the clip attribute in CSS, an attribute ignored by most people:

Syntax:
clip: auto | rect (number number number number)

Parameters:
auto: Object without shear
rect (number number number number): Provide four coordinates calculated from the upper left corner of the object as (0,0) in the order of top-right-bottom-left Offset value, any value can be replaced with auto, that is, this edge will not be cut.

It should be noted that
1.clip attribute must be used in conjunction with position:absolute.
2. The cutting reference point is always the upper left corner, which is different from margin and padding.
Example: