HTML TAG - <span>

<span>은 문자열이나 인라인 레벨 엘리먼트(inline-level element)를 위한 것으로 <div>나 <p>이 블록 엘리먼트들을 다루고 있는 것과 차이가 있습니다.

만약, 테이블과 같은 구조의 블록이 아니라 이름이나, 숫자 등의 비교적 작은 엘리먼트들에 대한 레이아웃을 핸들링 하고자 한다면 <span>을 써줍시다.

<span class="num">1,000</span>

id 활용

<span> 태그의 id 속성을 활용하여 데이터를 뿌리는 기능으로 사용할 수도 있습니다.

function ondisplayData() {
    document.getElementById("아이디").innerHTML = 데이터;
}

window.onload = function() {
    ondisplayData();
}

<span id="아이디"></span>    // '데이터'로 바뀐다!

예를들어, 현재 DB에 등록된 회원수가 얼마인지 웹페이지에 표시하고 싶다면, DB로 부터 값을 읽어와서 저런식으로 화면에 뿌려주면 되는 것이지요. 뿌려주고 싶은 값이 많은 경우에는 js파일을 따로 만들어서 회원수, 등록자료, 날짜 등 필요한 데이터를 뿌려주는 함수들을 각각 만들어서 필요한 위치에 <span>에 아이디 지정해서 뿌려주면 되겠습니다.