2016-08-02 4 views
1

healcode을 사용하여 내 사이트에 mindbody 데이터를 표시하고 있습니다. 나는 healcode 위젯을 사용하고 있는데, 문제는 단지 CSS을 변경할 수 있고, 만지면 안된다. HTML 위젯은 내 필요에 대해 매우 제한적인 테이블의 데이터를 전달한다. html 구조를 만들거나 적어도 현재 구조를 조작 할 수 있기를 원합니다.자바 스크립트를 사용하여 표에서 데이터를 추출하는 중

CSS 또는 Javascript 또는 둘 모두를 사용하여 테이블에서 콘텐츠 및 데이터를 추출하고 원하는 HTML 구조를 다시 만들 수 있습니까?

+0

JavaScript를 사용하여 DOM을 반복하고 다른 형식으로 표시 할 수 있지만 대신 데이터가 들어오는 위치를 찾고 원본에서 가져 오는 것이 가능합니까? –

+0

@DaveChen API를 사용 하시겠습니까? – user2684452

+0

DOM에 쉽게 액세스 할 수있는 라이브러리가있을 수 있지만 바닐라 JavaScript를 사용하여 [DOM에 액세스] (https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Introduction) 할 수 있습니다. –

답변

1

확실히 넓은 의미의 질문이지만 JavaScript를 통해이 작업을 수행 할 수 있습니다. 예를 들어, id가 someId 인 경우, var table = document.getElementById('someId');을 사용해야하고, table.innerHTML (아마도 좋은 시작점) 또는 DOM API를 사용하는 하위 항목을 조작해야합니다 (예 : for) : 조작 할 테이블 요소를 가져와야합니다.

// first table with the "w3-table-all notranslate" class 
var table = document.getElementsByClassName("w3-table-all notranslate")[0]; 

table 
    .children[0] // will get the tbody element 
    .children[1] // will get the second row from the tbody element 
    .children[0] // will get the first (colomn) cell in the second row 
    .innerHTML; // will show you html contents of the cell in the console 

// change the cell contents 
table.children[0].children[1].children[0].innerHTML = "<b>I've changed this stuff!</b>"; 

// you may also want to remember rows/cells: 
var row = table.children[0].children[1]; 
var cell = row.children[0]; 

을 그리고 기본적으로 그것 뿐이다 : this page ("매개 변수 값"표)를 브라우저 콘솔에서 시도 할 수 있습니다.

관련 문제