jqueryで新しいコンポーネントを作成する方法、変更して最後に別のコンポーネントに配置する

Question

新しい<li>コンポーネントを作成し、href、クラスなどを追加して、別の要素に配置します。

私はこれが働くだろうと思ったが、それはしていません：

var points = [1, 2, 3, 4]; 

$.each(points , function(){ 
    var $elm = $('<a>'+'Point:'+$(this)+'</a>'); 
    $elm.css('point'); 
    $elm.attr('href','http://somelink'); 
    $('#points_list').append('<li>'+$elm+'</li>'); 
}); 

htmlコードは次のとおりです。

<ul id="points_list"/> 

出力は次のとおりです。

オブジェクト

オブジェクト

オブジェクト

オブジェクト

Answer 1

JavaScriptが無効です（最初の行は構文エラーです）。あなたはそれを訂正しました。

私はこれが（私はcssビットを推測しなければならなかった、私はあなたがクラスとしてそれを追加するためのものと仮定）（live copy）あなたが何を意味するかかもしれないと思う：

var points = [1, 2, 3, 4]; 

$.each(points, function(index, point) { 
    var anchor, li; 

    anchor = $('<a>Point:' + point + '</a>'); 
    anchor.addClass('point'); 
    anchor.attr('href','http://somelink'); 
    li = $("<li>"); 
    li.append(anchor); 
    $('#points_list').append(li); 
}); 

しかし、それができますシンプルに：

0：

var points = [1, 2, 3, 4]; 

$.each(points, function(index, point) { 
    $('#points_list').append(
     '<li><a class="point" href="http://somelink">Point:' + point + '</a></li>' 
    ); 
}); 

私も見上げ一度points_listして、参照を再利用するお勧めします

var points = [1, 2, 3, 4]; var list = $('#points_list'); $.each(points , function(index, point){ list.append( '<li><a class="point" href="http://somelink">Point:' + point + '</a></li>' ); }); 

...でも、見ているものがidであるため、無料ではありません。

Answer 2

try thisvar points = [1、2、3、4];

$.each(points , function(){ 
    var $elm = '<a class="point" href="http://somelink">'+'Point:'+$(this)+'</a>'; 
    $('#points_list').append('<li>'+$elm+'</li>'); 
}); 

Answer 3

あなたはいくつかのことが間違っています。ここで

は、作業のデモです：http://jsfiddle.net/ReTjP/

HTMLコード：

<ul id="points_list"/> 
<input type="submit" value="go" id="go" /> 

Javascriptを：

$("#go").click(function() { 

    var points = [1, 2, 3, 4]; 

    $.each(points, function(index, value) { 
     var elm = $('<a>' + 'Point:' + value + '</a>'); 
     elm.css('point'); 
     elm.attr('href', 'http://somelink'); 
     $('#points_list').append('<li>' + elm.html() + '</li>'); 
    }); 
}); 

Answer 4

var points = [1,2,3,4]; 
$.each(points, function(index,value){ 
    $('<a>').html('Point:' + value).addClass('point').attr('href','http://somelink').appendTo('#points_list').wrap('<li />'); 
}); 

の作業のデモ：http://jsfiddle.net/AlienWebguy/vbF6Z/2/

Answer 5

あなたメートルこれを試してください

var points = [1, 2, 3, 4]; 

    $.each(points , function(){ 
     var $elm = $('<li><a>Point:'+$(this)[0]+'</a></li>'); 
     $elm.css('point'); 
     $('a', $elm).attr('href','http://somelink'); 
     $('#points_list').append($elm); 
    });