태그 안에 문자열, 태그 삽입과 삭제 [jQuery 사용]

JQUERY/태그안의 내용 추가,삭제

태그 안에 문자열, 태그 삽입과 삭제 [jQuery 사용]

정윤재 2010. 12. 23. 11:43

jQuery 를 사용하여 html 에서 데이터나 태그를 삽입하고 삭제 할 수 있다.

예제 코드를 보면서 확인 하도록 하겠다.

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Expires" content="0"/>
<meta http-equiv="Pragma" content="no-cache"/><meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jgcharts.js" type="text/javascript"></script>
<script>

function sub(){
var api= new jGCharts.Api();

jQuery('<br>').appendTo("#line1");
//line1 이라는 div 영역 안에 <br> 태그를 추가한다
jQuery('<br>').appendTo("#line1");
jQuery('<br>').appendTo("#line1");

jQuery('#line1').append("1234");
//문자열 삽입

jQuery('<br>').appendTo("#line1");
jQuery('<br>').appendTo("#line1");
jQuery('<br>').appendTo("#line1");

//jQuery('br').remove();
//<br> 태그 전부 삭제... (이런 방식으로 태그를 삭제 가능함)

jQuery('<img>')
.attr('src',api.make({
  title :'LBS',
  data : [[100],
          [40],
    [70]
    ],
          //1번째 y축 데이터 3개 (ting,ju,family)=> 1월 =>[110,2200,600]
          //2번째 y축 데이터 3개 (ting,ju,family)=> 2월 =>[120,2300,700]
          //3번째 y축 데이터 3개 (ting,ju,family)=> 3월 =>[400,300,100]
  type : 'lc',
  size : '1000x250',
  colors : ['000000'],
  grid : [20,50,3,3,10,20],


  legend : [encodeURIComponent('친구찾기')],
  axis_type      : ['x,y'],
  //axis_range     : [[0,10],[90,100]]
  axis_labels : ['11-1','11-2','11-3']

})).appendTo("#line1");
//lc,lxy
  }
</script>
</head>
<body onload="sub()">
<div id="line1">
</div>
</body>
</html>

jQuery 를 사용하여 이미지를 만들고 <br> 태그 삽입 1234 같은 텍스트 문자열 삽입

삭제 하는 코드입니다.

저작자표시