2014-12-24 2 views
1

모든 동적 클래스에 정보 div를 동적으로 추가하고 싶습니다.동적으로 div를 클래스 내에서 추가하는 방법 - Jquery

HTML I는 다음과 같이 원하는

<div id='container'> 
    <div class='dynamic'></div> 
    <div class='dynamic'></div> 
    <div class='dynamic'></div> 
    <div class='dynamic'></div> 
</div> 

.

<div id='container'> 
    <div class='dynamic'><div class="info">info</div></div> 
    <div class='dynamic'><div class="info">info</div></div> 
    <div class='dynamic'><div class="info">info</div></div> 
    <div class='dynamic'><div class="info">info</div></div> 
</div> 

JS FIDDLE

답변

2

는 jQuery를 사용하여 모든 클래스 내로 정보 사업부를 추가하려면 사용

$(".dynamic").append("<div class='info'>info</div>"); 

JSFiddle 그것을 보여줍니다. 당신은 (1 초) .dynamic 클래스에 대한 모든 1000MS를 확인하는 위의 경우

$(document).ready(setInterval(function(){ 
    $(".dynamic").append("<div class='info'>info</div>"); 
}, 1000)); 

: 당신이 지속적으로 .dynamic 클래스를 확인하려면

는, 다음과 같이 사용할 수 있습니다.

희망이 도움이됩니다.

+0

왜 그렇게 했습니까? 추가 할 때마다 초 확인 ... – Mivaweb

+1

질문은 "모든 동적 클래스에 정보 div를 동적으로 추가하고 싶습니다."라는 문구가 있습니다. 아마도 사용자가 일부 사용자 작업을 통해 div를 동적으로 추가하고 해당 div에 정보 div가 포함되기를 원할 것입니다. 그래서 옵션/예제를 제공한다면 유용 할 것입니다. – gehleh

+0

고마워요 @ gehleh, 그리고 어떻게 내가 .info를 일부 div에 부모로 추가 할 수 있습니다. –

3

당신은 $.wrapInner이 방법을 사용할 수 있습니다

$(".dynamic").wrapInner('<div class="info">info</div>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="container"> 
 
    <div class="dynamic"></div> 
 
    <div class="dynamic"></div> 
 
    <div class="dynamic"></div> 
 
    <div class="dynamic"></div> 
 
</div>

+1

감사 Alexander. –

2

append()를 사용해보십시오 :

$('.dynamic').append($('<div/>', { class: 'info' }).html('info')); 

업데이트하여 바이올린 :

http://jsfiddle.net/4cncLor7/2/

당신의 .dynamic 사업부는 이미 내용을 포함하고 처음에 .info 사업부에서 prepend() 사용에 당신이 원하는 경우 : 당신이 뭔가를 할 수

$('.dynamic').prepend($('<div/>', { class: 'info' }).html('info')); 
0

을 이렇게 :

$('.dynamic').each(function() { 
    var newDiv = $('div'); 
    newDiv.addClass('info'); 
    newDiv.html('info'); 

    //inject the new div 
    $(this).append(newDiv); 
}); 
1

나는 그것을 업데이트했다. 확인하고 피드백을주십시오. http://jsfiddle.net/4cncLor7/4/

jQuery('.dynamic').html('<div class="info">info</div>'); 
0

체크 코드 : Example

자바 스크립트 :

var vof=$("#box1").val(); 
//$(".result-box").text(vof); 
var e = $('<div class="result-box">'+vof+'</div>'); 
$('#box').append(e); 

HTML : 때마다 버튼을 클릭 할 수 있도록 여기에 내가 동적 사업부를 만드는 오전

<div id="box"> 
<!--<div class="result-box" id="rbx"></div>--> 
</div>  

이 새로운 사업부 생성하고 개별적으로 속성 ID를 추가 할 수 있습니다.

관련 문제