使用javascript从html ID获取信息？

Question

我需要从这个div获取javascript日期：

<div id="popupDateFieldMin" class="dateField">2017-08-02</div>

这是我这部分的实际代码。

var cal = document.getElementById( 'popupDateFieldMin' );
    console.log(cal.outerHTML)

提前感谢，G。B

Answer 1

您可以使用innerHTML：

    var cal = document.getElementById( 'popupDateFieldMin' );
    console.log(cal.innerHTML)

 <div id="popupDateFieldMin" class="dateField">2017-08-02</div>

Answer 2

project.iml

您也可以按

设置值

var dateValue = document.getElementById("popupDateFieldMin").value;
console.log(dateValue);

Answer 3

使用innerHTML属性

根据MDN：

  

Element.innerHTML属性设置或获取描述元素后代的HTML语法。 MDN

返回时，您将获取DOM内容作为字符串，而不仅仅是div中的文本。

<div id="popupDateFieldMin">2017-08-02</div>

您将获得以下结果：

content = document.getElementById('popupDateFieldMin').innerHTML
// content = 2017-08-02

如果更改div元素的结构会发生什么？通过添加span元素，例如：

<div id="popupDateFieldMin"><span style="color:blue">2017</span>-08-02</div>

innerHTML将返回<span style="color:blue">2017</span>-08-02而不是2017-08-02。

如果您的div只包含文本但在所有情况下都不合适，那就没问题了。

更好的解决方案：textContent属性

  

Node.textContent属性表示节点及其后代的文本内容。

返回每个子节点的textContent属性值的串联。它具有更好的性能，因为文本不会被解析为HTML。而且，使用textContent可以防止XSS攻击。

content = document.getElementById('popupDateFieldMin').textContent
// content = 2017-08-02
// in both cases

最佳实践：时间元素

  

HTML元素表示24小时制的时间或公历中的精确日期（带有可选的时间和时区信息）。

此元素用于以机器可读格式显示日期和时间，以供将来的数据处理。

<time id="myTime" datetime="2017-08-02">2017-08-02</time>

然后，要访问此值：

document.getElementById("myTime").getAttribute("datetime");

Answer 4

cal.textContent将在转换值后为您提供标记的值 日期使用新的日期（）。

示例

  let dateString =cal.textContent 
  console.log(dateString ) //value 2017-08-02
  let date = new Date(dateString) //gives date object