获取id为data属性的元素

时间:2015-07-16 06:53:47

标签: javascript jquery get element

我有一个容器,其id是ajax调用响应的一部分。我动态创建这些容器。 我需要在函数中获取该元素。我的代码是:

for(var i=0; i<data.length;i++){
var div = document.createElement('div');
div.className = 'message';
div.id=data[i].name;

var p = document.createElement('p');
p.innerHTML = "Ha realizado check-in en " + data[i].name;
div.appendChild(p);

var a = document.createElement('a');
a.href = '#';
a.className = 'bt-enter';
a.innerHTML = 'Cerrar';
a.addEventListener('click', function () {
     jQuery("#data[i].name").fadeOut();   //This line is the one I have to change
});
div.appendChild(a);
document.getElementsByTagName('section')[0].appendChild(div)
}

1 个答案:

答案 0 :(得分:0)

由于循环中有闭包,因此无法直接访问这些变量。

for (var i = 0; i < data.length; i++) {
    var div = document.createElement('div');
    div.className = 'message';
    div.id = data[i].name;

    var p = document.createElement('p');
    p.innerHTML = "Ha realizado check-in en " + data[i].name;
    div.appendChild(p);

    var a = document.createElement('a');
    a.href = '#' + data[i].name;
    a.className = 'bt-enter';
    a.innerHTML = 'Cerrar';
    a.addEventListener('click', function (e) {
        e.preventDefault();
        jQuery(this.href).fadeOut(); //This line is the one I have to change
    });
    div.appendChild(a);
    document.getElementsByTagName('section')[0].appendChild(div)
}

注意:由于您使用的是jQuery,因此将其用于对象创建,如

var $section = $('section').eq(0);
$.each(data, function (i, item) {
    var $div = $('<div />', {
        'class': 'message',
        id: item.name
    }).appendTo($section);
    $('<p />', {
        html: "Ha realizado check-in en " + item.name
    }).appendTo($div);
    var $a = $('<a />', {
        href: '#',
            'class': 'bt-enter',
        html: 'Cerrar'
    }).appendTo($div);
    $a.click(function () {
        $div.fadeOut();
    });
});