html修改span中的内容,在HTML中抓取span的内容

在我的shopify产品页面上，我设置了它，所以当我点击色样时，会打印出颜色选择。它遵循本文的原则：

我的第二个目标是，当选择其中一种颜色时，我可以打印出具有该颜色描述的页面的page.content。

我遇到的问题是，当我尝试将变量(在.liquid中)设置为等于正在打印的颜色时，我无法获取内容，因为它正从.js文件传递到.liquid文件通过类(.liquid中的span的实际内容为空)。

以下是代码示例，以便您了解：

.js文件

if (variant.option1) {

var fabric = variant.title;

fabric = fabric.replace(/\s+/g, '-').toLowerCase(); //new object assigned to var str

var fabricContent = fabric

$('.variant-fabric-name').text(variant.option1);

if (variant.title) {

$('.variant-fabric-description').text(fabricContent);

}

.liquid文件。

{% if product.options[0] %}

{% capture my_variable %}{% endcapture %}

: {{ pages[my_variable].content }}

{% endif %}

我已经使用了变体标题，并将其设置为小写，并在单词之间添加了一个短划线，以便它可以是我可以创建并匹配的页面句柄。

正如您所看到的，我正在尝试将fabricContent(页面句柄)的值放入.liquid变量my_variable中，以便我可以将其输入页面[page] .content代码，但我不能因为跨度是实际上是空的