Javascript 如何计算文本对齐:居中div中文本左边框和开头之间的间距? 测试我

Javascript 如何计算文本对齐:居中div中文本左边框和开头之间的间距? 测试我,javascript,jquery,text-align,Javascript,Jquery,Text Align,因此,我需要一个从左侧到div中字符串第一个字母的左边距px?计算字符与其容器之间距离的唯一方法是在文本之前添加一个内联元素,然后从占位符中减去父元素的左偏移量(使用) 示例(演示:) HTML: 测试我 JavaScript: <div id="some-div" style='text-align: center; width: 300px'>test me</div> var$elem=$(“#some div”),//选择元素 $placeholder=$(“

因此,我需要一个从左侧到div中字符串第一个字母的左边距px?

计算字符与其容器之间距离的唯一方法是在文本之前添加一个内联元素,然后从占位符中减去父元素的左偏移量(使用)

示例(演示:

HTML:

测试我
JavaScript:

<div id="some-div" style='text-align: center; width: 300px'>test me</div>
var$elem=$(“#some div”),//选择元素
$placeholder=$(“”);//创建内联占位符
$elem.prepend($placeholder);//在内容之前添加占位符
//计算距离
变量距离=$placeholder.offset().left-$elem.offset().left;
$placeholder.remove();//删除占位符
警报(距离);//示例:显示结果

也许可以用另一个元素(
span
)包装文本,并将其
.offsetLeft
与您的
div
进行比较。

正如卡拉什尼科夫所说,您需要将文本包装在span标签中,但还需要做一些额外的工作。您需要得到跨度位置和父(div)偏移量,然后减去它们得到答案。代码如下:

var $elem = $("#some-div"),     // Select element
    $placeholder = $("<span>"); // Create inline placeholder
$elem.prepend($placeholder);    // Add placeholder before its contents

// Calculate distance
var distance = $placeholder.offset().left - $elem.offset().left;
$placeholder.remove();          // Remove placeholder
alert(distance);                // Example: Display result

你到底为什么要这么做?你想做什么?这在Chrome中似乎不起作用。我猜span需要内联block@juandopazo谢谢你的贡献。我很感激。
var $elem = $("#some-div"),     // Select element
    $placeholder = $("<span>"); // Create inline placeholder
$elem.prepend($placeholder);    // Add placeholder before its contents

// Calculate distance
var distance = $placeholder.offset().left - $elem.offset().left;
$placeholder.remove();          // Remove placeholder
alert(distance);                // Example: Display result
var position = $("span").position();
var parentOffset = $("span").parent().offset();
var left = position.left - parentOffset.left;