将修改后的字符串回到其原始的HTML元素中

Question

i有一个由插件动态生成的字符串，我已经更改了使用正则插入的日期的格式。

代表新字符串以正确格式显示的VAR在控制台中显示了正确的格式，但是当我尝试将其传递回InnerHtml时，什么也没发生？

如何将第二个（重新格式化的）日期字符串传递给html元素。

非常感谢，

艾米丽

// remove space in string
var dateStr = document.querySelector(".date-start").innerHTML;
secondDateStr = dateStr.replace(/sam$/, "am");
dateStr.innerHTML = secondDateStr;
console.log(secondDateStr)

<div class="date-start">January 6, 2018 @ 10:00 am</div>

Answer 1

在已发布的代码中，您将字符串（htmlelement.innerhtml是字符串类型）分配给变量。

然后在dateStr.innerHTML中，JavaScript中的字符串会自动施放到字符串类型的实例中，因此在这里您将新属性添加到dateStr object 。。

相反，将DOM元素分配给要开始的变量，根据需要操作字符串，然后为元素的innerHTML属性分配一个新值。

您还想确保选择器返回单个元素，否则，如果它返回了一个元素时所做的集合，则要获得一个特定的元素，例如 document.querySelector(".date-start")[0]

// remove space in string
var dateEl = document.querySelector(".date-start");
secondDateStr = dateEl.innerHTML.replace(/sam$/, "am");
dateEl.innerHTML = secondDateStr;
console.log(secondDateStr)

<div class="date-start">January 6, 2018 @ 10:00 am</div>