자바 스크립트에서 요소 및 클래스 구현의 동적 생성

자바 스크립트에서 innerHTML을 사용하여 동적으로 요소를 만드는 데 문제가 있습니다. 다음은 코드입니다.자바 스크립트에서 요소 및 클래스 구현의 동적 생성

var newElement = document.createElement("tr"); 
newElement.innerHTML = ['<td><a href="javascript:void(0);">Test Suite</a></td><td>4,977</td><td class="text-align-center">', 
         '<div class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2">2700, 3631, 2471, 1300, 1877, 2500, 2577, 2700, 3631, 2471, 2000, 2100, 3000</div>', 
      ].join('\n'); 

$("#locationsGraph").append(newElement);

문제는 요소가 올바르게 작성되었지만 요소 클래스가 구현되지 않았기 때문입니다. 이 부분

class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2"

내가 막대 그래프를 얻을해야하지만, 대신에 내가 숫자 같은 목록을 가져옵니다.

innerHTML 클래스의 구현과 관련이 있습니까? 또한 수동으로 모든 요소를 만들고 className을 할당했지만 결과는 동일했습니다.

출처

2015-01-14 autodev101

아마도 차트 새로 만든 요소에서 실행되고 있지 않습니다 생성하는 데 사용하는 무엇도. DOM을 실제 차트로 변환하려면 다시 호출해야합니다. –

숫자가 정확히 '막대 그래프'입니까? 이 작업을 수행하기 위해 어떤 메소드를 호출해야 할 것입니다 ... – haim770

이것은 인라인 barGraph의 데모이며,이 숫자는 막대의 임의 숫자입니다. – autodev101

the docs에 따르면 $(newElement).find('div').sparkline()을 실행해야합니다.

출처

2015-01-14 15:09:54

안녕하세요 성공 :)) 고마워요. 저는 자바 스크립트/jquery에 익숙하지 않습니다. 스파크 라인에 대한 설명서를 확인하지 않았습니다. – autodev101

@ autodev101 : 질문에서 * 사용중인 도구 (예 : 스파크 라인) *와 같은 정보를 포함하면 더 나은 결과를 얻을 수 있습니다. –

@MattBurland 솔직히 말해서 나는 스파크 라인이 도구라는 것을 알지 못했고, 나는 템플릿 작업을하고 있고, 마감 시간이 있기 때문에 일을 빨리 끝내야했지만, 앞으로는 그렇게 할 것입니다. 감사 – autodev101

당신이 일치하는 폐쇄 해달라고 당신의

newElement.innerHTML = ['<td><a href="javascript:void(0);">Test Suite</a></td><td>4,977</td><td class="text-align-center">', 
         '<div class="sparkline txt-color-blue text-align-center" data-sparkline-height="22px" data-sparkline-width="90px" data-sparkline-barwidth="2">2700, 3631, 2471, 1300, 1877, 2500, 2577, 2700, 3631, 2471, 2000, 2100, 3000</div>', 
      '</td>' //this is missing 
    ].join('\n');

출처

2015-01-14 15:30:30 sabkaraja

자바 스크립트에서 요소 및 클래스 구현의 동적 생성

답변

관련 문제