Question

我在一个数组中有3个对象。

myArray = [
{name: "iPhone", link: "www.apple.com"},
{name: "Nokia", link: "www.nokia.com"},
{name: "Google", link: "www.Google.com"}
]

如何制作循环并将属性放在一起以显示在页面上，如下所示：

iPhone 诺基亚谷歌

点击它们时有链接

谢谢！

Answer 1

使用纯JS，就像那样：

for(var i=0;i<myArray.length;i++){
    var a = document.createElement('a');
    a.href= myArray[i].link;
    a.text= myArray[i].name;
    document.body.appendChild(a);
}

但使用jQuery会更容易：

您可以使用jQuery .each()。它将遍历您的数组，您可以使用this访问对象属性。

要创建链接，您需要创建一个a元素，并通过.attr()和.text()确定其价值

$.each(myArray, function(){
    var a = $('<a/>'); //The element itself
    a.attr('href', this.link) //The HREF
    a.text(this.name) //The text
    $('body').append(a) //Append to the body
})

Answer 2

你可以这样做：

myArray = [
           {name: "iPhone", link: "www.apple.com"},
           {name: "Nokia", link: "www.nokia.com"},
           {name: "Google", link: "www.Google.com"}
         ];
var myDiv = '<div>';
for(var i=0;i<myArray.length;i++){
    myDiv= myDiv+ '<a href=\"'+myArray[i].link+'\">'+myArray[i].name +'</a><br/>';
}
myDiv = myDiv + '</div>';
$('#someDiv').append(myDiv); // append it to some other div

享受！

Answer 3

循环并将属性放在一起以显示在页面上

听起来你想创建一个html字符串：

var list = "<ul>";
for (var i=0; i<myArray.length; i++) {
    list += "<li><a href='"+myArray[i].link+"'>"+myArray[i].name+"</a></li>";
}
list += "</ul>";
$("body").html(list); // or something

JavaScript对象属性 - 将它们连接在一起？

3 个答案: