本文探讨如何使用 jQuery 获取和设置 DOM 元素的内边距和外边距值，特别是元素外边距和内边距的具体位置。虽然可以使用 CSS 设置元素的内边距和外边距，但获取准确的值可能会比较棘手。
// 设置
$("div.header").css("margin","10px");
$("div.header").css("padding","10px");你可能会认为这段代码很简单，但实际效果并非如此。
// 获取
$("div.header").css("margin");
$("div.header").css("padding");自己尝试一下（将以下代码粘贴到 Firebug 中）。你会发现返回的 margin 和 padding 值为空。
(function($){
function logMarginPadding(elem) {
// 获取
var margin = elem.css("margin"),
padding = elem.css("padding");
console.log("margin="+margin+" padding="+padding);
}
var elem = $("div.header"); // 设置要检查的元素
logMarginPadding(elem);
// 设置
elem.css("margin","10px");
elem.css("padding","10px");
logMarginPadding(elem);
})(jQuery);这段代码似乎有效。
// 获取元素的顶部外边距
alert($("div.header").css("margin-top"));
// 获取元素的顶部外边距（整数）
alert($("a").css("margin-top").replace("px", ""));
// 如果与计算一起使用，则必须将其转换为整数
parseInt($("a").css('padding-left').replace("px", ""));总之，这就是我获取元素内边距的方法。这种方法并不理想，而且仅在内边距均匀（每侧相同）的情况下才有效。只需获取宽度和外宽度，然后除以 2 即可。
var item = $('div.header');
width = item.width(),
padding = (item.outerWidth()-width)/2;一个名为 jsizes 的流行插件可能是获取/设置元素内边距/外边距值的良好解决方案。JSizes 是 jQuery JavaScript 库的一个小型插件，它增加了对查询和设置 CSS min-width、min-height、max-width、max-height、border-*-width、margin 和 padding 属性的支持。
进一步阅读
jQuery 具有 outerWidth 和 outerHeight 函数，默认情况下包含边框和内边距，如果函数的第一个参数为 true，则还包含外边距。 https://www.php.cn/link/25e828afe5f637410a84442d27029c38 https://www.php.cn/link/a47ad724599e11d59272b02d08d0dbd7
jQuery 元素内边距/外边距常见问题解答 (FAQ)
可以使用 jQuery 的 css() 方法获取元素的内边距。此方法返回计算出的样式属性值。例如，要获取 div 元素的内边距，可以使用以下代码：
var padding = $("div").css("padding");这将以像素为单位返回 div 元素的内边距值。
可以使用 jQuery 的 css() 方法设置元素的外边距。此方法设置所选元素的一个或多个样式属性。以下是如何设置 div 元素外边距的示例：
$("div").css("margin", "20px");这将把 div 元素的外边距设置为 20 像素。
outerWidth() 和 outerHeight() 的区别是什么？jQuery 中的 outerWidth() 方法返回元素的宽度，包括内边距和边框。如果可选参数设置为 true，则还包括外边距。另一方面，outerHeight() 方法返回元素的高度，包括内边距和边框。如果可选参数设置为 true，则还包括外边距。
jQuery 提供了几种方法来获取元素的尺寸。这些方法包括 width()、height()、innerWidth()、innerHeight()、outerWidth() 和 outerHeight()。每种方法都返回所选元素的相应尺寸。
可以使用 width()、height()、innerWidth()、innerHeight()、outerWidth() 和 outerHeight() 方法在 jQuery 中更改元素的尺寸。这些方法不仅返回所选元素的相应尺寸，而且在传递值作为参数时还可以设置新的尺寸。
innerWidth() 和 outerWidth() 的区别是什么？jQuery 中的 innerWidth() 方法返回元素的宽度，包括内边距但不包括边框或外边距。另一方面，outerWidth() 方法返回元素的宽度，包括内边距和边框。如果可选参数设置为 true，则还包括外边距。
jQuery 没有直接的方法来获取元素的边框宽度。但是，可以使用 css() 方法获取计算出的样式属性值，包括边框宽度。例如：
// 设置
$("div.header").css("margin","10px");
$("div.header").css("padding","10px");这将以像素为单位返回 div 元素的边框宽度。
可以使用 jQuery 的 css() 方法同时设置元素的内边距和外边距。例如：
// 获取
$("div.header").css("margin");
$("div.header").css("padding");这将分别将 div 元素的内边距和外边距设置为 10 像素和 20 像素。
可以使用 jQuery 的 css() 方法获取元素的外边距。此方法返回计算出的样式属性值。例如，要获取 div 元素的外边距，可以使用以下代码：
(function($){
function logMarginPadding(elem) {
// 获取
var margin = elem.css("margin"),
padding = elem.css("padding");
console.log("margin="+margin+" padding="+padding);
}
var elem = $("div.header"); // 设置要检查的元素
logMarginPadding(elem);
// 设置
elem.css("margin","10px");
elem.css("padding","10px");
logMarginPadding(elem);
})(jQuery);这将以像素为单位返回 div 元素的外边距值。
可以使用 jQuery 的 css() 方法设置元素的边框宽度。此方法设置所选元素的一个或多个样式属性。以下是如何设置 div 元素边框宽度的示例：
// 获取元素的顶部外边距
alert($("div.header").css("margin-top"));
// 获取元素的顶部外边距（整数）
alert($("a").css("margin-top").replace("px", ""));
// 如果与计算一起使用，则必须将其转换为整数
parseInt($("a").css('padding-left').replace("px", ""));这将把 div 元素的边框宽度设置为 2 像素。
以上是jQuery获取元素填充/保证金的详细内容。更多信息请关注PHP中文网其他相关文章！
