Implementation Methods of Getting and Setting Length and Width with Query's Common DIV Operations

Get or set the height and width of div

Method One:height and width functions (the result is a number), can be used to get or set the height and width of an element.

val() to get or set the value of an element

Method Two:The css function can be used to get or set the height and width of an element

Get css("width") (the result is a string ending with 'px'), set css("width",20px) or css({width:20px,height:20px})

JQuery's Chaining Operation

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/8-8html; charset=utf /> 
.js"></"/javascript" src="jQuery-1jquery12jquery1./script> 
.js"></<script type="text 
javascript"> 
  $("function"(){ 
    //$("#get").click(function(){ 
    $("#ht").val($("#div").width());1The result does not contain 'px' 
    $("#wd").val($("#div").css("height"));1").height()); 
    //The result contains 'px' 
    //$("#ht").val($("#div").width());1").css("height")); 
    //$("#wd").val($("#div").css("height"));1").css("width");}} 
  }); 
  $("#make").click(function(){ 
    //$("#div1").css({height:$("#ht").val(),width:$("#wd").val()}); 
    //$("#div1").css("height",$("#ht").val()); 
    //$("#div1").css("width",$("#wd").val()); 
    $("#div1").height($("#ht").val()); 
    $("#div1").width($("#wd").val()); 
    // JQuery's Chaining Operation 
    //$("#div1").css("height",$("#ht").val()).width($("#wd").val()); 
  }); 
}); 
</script> 
<style type="text/css"> 
#div1 
{ 
  width:150px; 
  height:150px; 
  background-color:red; 
  border:black 1px solid; 
} 
</style> 
</head> 
<body> 
Length<input type="text" id="ht"/>Width<input type="text" id="wd"/> 
<input type="button" value="Get" id="get"/> 
<input type="button" value="Set" id="make"/> 
<div id="div1></div> 
</body> 
</html>

This is the full content of the implementation method of getting and setting the length and width of the Query commonly used DIV operation brought to you by the editor. I hope it will be helpful to everyone, and please support and cheer for the tutorial~

Basic Tutorial