728x90
SMALL
#jquery
#.before()
#method to add a new element before the selected element or move the element to another location
.before()
.before() can add a new element before the selected element or move an element in another place.
grammar
.before( content [, content ] )for example
$( 'h1' ).before( '<p>Hello</p>' );adds a p element with Hello as its content before the h1 element.
$( 'h1.a' ).before( $( 'p.b' ) );will move the p element with b as class value before the h1 element with a as class value.
example1
Add an h1 element with the Lorem Ipsum Dollor as content before the p element.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery</title>
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$( document ).ready( function() {
$( 'p' ).before( '<h1>Lorem ipsum dolor.</h1>' );
} );
</script>
</head>
<body>
<p>Hello World!</p>
</body>
</html>example2
Move the p element behind the h1 element to the front of the h1 element.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery</title>
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$( document ).ready( function() {
$( 'h1' ).before( $( 'p' ) );
} );
</script>
</head>
<body>
<h1>Lorem ipsum dolor.</h1>
<p>Goodbye World!</p>
</body>
</html>Adding or moving an element before the selected element is .after() .
728x90
LIST