Question

好的，这是我的问题陈述：我试图创建具有这些属性{"name":"John Doe","email":"name@domain.com"}的对象，并且试图通过访问对象的属性来打印出指向该电子邮件地址的HTML链接。

到目前为止，这是我的对象

var firstObject = {
  name: 'John Doe' ,
  email: 'name@domain.com'
};
console.log(firstObject);

我希望我的console.log输出能够通过访问如下对象来打印href链接：

"<a href="mailto:name@domain.com">John Doe</a>"

Answer 1

如果要在javascript中构建元素，然后将其记录下来，我可以这样做：

var element = '<a href="mailto:' + firstObject["email"] + '">' + firstObject["name"] + '</a>'
console.log(element)

Answer 2

只需执行以下操作：

console.log("mailto:" + firstObject.email);

如果您要在链接中添加它，

<a href=""></a>

<script>
    document.getElementsByTagName("a")[0].setAttribute("href", "mailto:" + firstObject.email;
    document.getElementsByTagName("a")[0].innrHTML = firstObject.name;

Answer 3

我尝试了这段代码，效果很好。

我使用了DOMContenLoaded

当文档完全加载并解析后，无需等待样式表，图像和子帧完成加载，就会触发DOMContentLoaded事件。

<!DOCTYPE html>
<html lang="en">
<head>
  <!-- link to external JS file.  Note that <script> has an
  end </script> tag -->
  <meta charset="utf-8">
  <title> Task 6 </title>
  <link href="style.css" type="text/css" rel="stylesheet">
  <script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function(event) {

  var firstObject = {
  name: 'John Doe' ,
  email: 'name@domain.com'
};
      document.getElementsByTagName("a")[0].setAttribute("href", "mailto:" + firstObject.email);
      document.getElementsByTagName("a")[0].innerHTML =firstObject.name;
});

</script>
</head>
<body>
<a href=""></a>
</body>
</html>

将对象文字链接到HTML地址

3 个答案: