Javascript 将一个元素的宽度绑定到同级元素的宽度

我正在尝试将

标记的最大宽度设置为同级

标记的宽度

以下是相关代码：

<div>
  <p>
    <h2 id="annotation_preview_title"> <%= t('marker.annotation.preview_title') %></h2>
  </p>
  <p id="annotation_preview" style="word-wrap: break-word;"></p>
</div>

---

两者都不起作用。我对任何和所有的解决方案都持开放态度（纯JS、纯CSS、混合等等）。

因为您已经在使用jQuery：

$("#annotation_preview").css("max-width", $("#annotation_preview_title").width());

---

我还没有测试过它，但是按照这些思路应该可以做到。

不属于内部。不管怎样，display中的标题是内联的吗？如果不是，那么尽管内容很短，但其宽度仍然是100%，我只会在包含这两个内容的父div上放置一个

max width

。。或固定宽度。这是获得与您所寻找的内容类似的内容的最简单方法。是的，在div上放置

最大宽度

是最简单的，但我希望避免这样做，因为我正在本地化

注释\u预览\u标题

@我知道NEP不属于

，但它在代码的其他地方使用，我只是想保持一致。我不太清楚你所说的“虽然内容很短，但宽度仍然是100%”是什么意思。当前，元素本身的title.Width与其中文本的长度没有样式。检查或添加一个临时边框到注释\u预览\u标题，你会看到它。像这样吗？这导致了以下错误：

uncaughttypeerror:无法读取null的属性“css”

。我试着做了

previewParagraph.css（“max-width”，title.width（））

但这导致了以下错误：

uncaughttypeerror:undefined不是函数

结果是

title.width（）

是我的变体的问题。但是，

var-width=title.width

导致

width

为

undefined

。如果没有jQuery选择器，.css（）方法将无法工作。您的第一个错误意味着

$（“#注释_预览”）

与任何内容都不匹配。确保此脚本在加载所有相关元素后运行。脚本在原始帖子图像中显示的

Create New Annotation

标题下的文本框中的每个键向上后运行。是否有可能

$（'#annotation_preview“）

找不到元素，但

document.getElementById（“annotation_preview”）

找到了？在$（）选择器中有单引号和双引号。在代码中也是这样吗？

$("#annotation_preview").css("max-width", $("#annotation_preview_title").width());