jQuery unwrap()

by

The jQuery unwrap() method removes the parent element of the selected elements. Syntax: $(selector).unwrap() Example1: <!DOCTYPE html> <html> <head> <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script> <script> $(document).ready(function(){ $(“#btn1”).click(function(){ $(“p”).wrap(“<em></em>”); }); $(“#btn2”).click(function(){ $(“p”).unwrap(); }); }); </script> </head> <body> <p>Hello!</p> <p>Nice to see you.</p> <button id=”btn1″>Wrap</button> <button id=”btn2″>Unwrap</button> </body> </html> Example2: <!DOCTYPE html> <html> <head> <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script> <script> $(document).ready(function(){ $(“#btn1”).click(function(){ $(“p”).wrapAll(“<div></div>”); … Read more

jQuery wrapAll()

by

jQuery wrapAll() method wraps the specified HTML elements around all the selected elements. Syntax: $(selector).wrapAll(wrappingElement) Wrapping Element: It is a compulsory parameter. It is used to specify the HTML elements to wrap around the selected elements. It can accept HTML elements, jQuery objects, and DOM elements as a value. Example1: <!DOCTYPE html> <html> <head> <script … Read more

jQuery wrapInner()

by

jQuery wrapInner() method wraps all the HTML structure around the content of each element of the selected element. Syntax: $(selector).wrapInner(wrappingElement,function(index)) WrappingElement: It is a compulsory parameter. It is used to specify the HTML elements to be wrapped around the content of each selected element. It can accept HTML elements, jQuery objects, and DOM elements as … Read more

jQuery wrap()

by

jQuery wrap() method wraps the specified HTML elements around each selected element. Syntax: $(selector).wrap(wrappingElement,function(index)) WrappingElement: It is a compulsory parameter. It is used to specify the HTML elements to be wrapped around each selected element. It can accept HTML elements, jQuery objects, and DOM elements as a value. Function: It is an optional function to … Read more

jQuery outerHeight()

by

jQuery innerHeight() method returns the inner height of the selected element. Border and padding both are included in this method. Syntax: $(selector).outerHeight(includeMargin) includeMargin: This parameter accepts Boolean value to specify whether the margin is to include or not. False: Not to include the margin. True: To include the margin. Example1: <!DOCTYPE html> <html> <head> <script … Read more

jQuery outerWidth()

by

jQuery outerWidth() method returns the outer width of the selected element. Border and padding both are included in this method. Syntax: $(selector).outerWidth(includeMargin) includeMargin: This parameter accepts Boolean value to specify whether the margin is to include or not. False: Not to include the margin. True: To include the margin. Example1: <!DOCTYPE html> <html> <head> <script … Read more

jQuery innerHeight()

by

jQuery innerHeight() method returns the inner height of the selected element. Padding is included in this method but not the border and margin. Syntax: $(selector).innerHeight() Example1: <!DOCTYPE html> <html> <head> <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script> <script> $(document).ready(function(){ $(“button”).click(function(){ alert(“Inner height of the div is: ” + $(“div”).innerHeight()); }); }); </script> </head> <body> <div style=”height:100px;width:500px;padding:5px;margin:3px;border:1px solid blue;background-color:lightpink;”></div><br> <button>Height</button> </body> … Read more

jQuery innerWidth()

by

jQuery innerWidth() method returns the inner width of the selected element. Padding is included in this method but not the border and margin. Syntax: $(selector).innerWidth() Example1: <!DOCTYPE html> <html> <head> <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js”></script> <script> $(document).ready(function(){ $(“button”).click(function(){ alert(“Inner width of the div is: ” + $(“div”).innerWidth()); }); }); </script> </head> <body> <div style=”height:100px;width:500px;padding:5px;margin:3px;border:1px solid blue;background-color:lightpink;”></div><br> <button>Width</button> </body> … Read more

jQuery height()

by

jQuery height() method sets or returns the height of the selected element. Syntax: When used to return the height: $(selector).height() When used to set the height: $(selector).height(value) When used to set the height using a function: $(selector).height(function(index,currentheight)) Value: Value is a compulsory parameter of the jQuery height() method, as it specifies the height to set … Read more

jQuery width()

by

jQuery width() method sets or returns the width of the selected element. Syntax: When used to return the width: $(selector).width() When used to set the width: $(selector).width(value) When used to set the width using a function: $(selector).width(function(index,currentwidth)) Value: Value is a compulsory parameter of the jQuery width() method, as it specifies the width to set … Read more