형우의 웹개발

ckeditor, 자바스크립트로 내용 집어넣기(전체 내용 바꾸기)

웹에디터를 커스터마이징하기 위해서 내용을 제어할 수 있어야 할 것이다. 앞서 ‘선택’하는 방법을 썼다. 이번에는 내용을 집어넣는 방법이다.

CKEDITOR.instances.textarea_id.setData('<p>집어넣을 데이터</p>')
//textarea_id는 당연히 각자 상황에 맞는 이름으로.

전체 내용을 가져오는 방법이 getData()다. 거기서 착안해 setData로 해봤더니 작동한다.

내가 궁금한 것은 커서가 위치한 곳에 특정한 element를 집어넣는 방법, 선택한 영역을 특정 오브젝트로 치환하는 방법이다. 더 알아보면 되겠지.

굳이 첨언하자면, ckeditor 안에 있는 내용을 태그 포함해서 다 가져오는 함수는 아래와 같다.

CKEDITOR.instances.textarea_id.getData()

👇 댓글

👇 관련글

🤔 기타 질문하기

카테고리

17년차 풀스택 웹 개발자 안형우입니다

웹 개발에서도 중요한 것은 개념입니다.
이 블로그에는 제가 개발하며 익힌 개념들을 정리합니다.

워드프레스를 오래 다뤄 왔고 강의도 두 편 찍었습니다.
– 인프런 “워드프레스 제대로 개발하기 어드민 편, 클라이언트 편”
– 클래스101 “누구나 할 수 있는 워드프레스 홈페이지 만들기 – 기획부터 출시까지 한 방에 OK”

유튜브 채널에 워드프레스 관련 팁들을 올리고 있습니다.

👉 소개 더 보기

대표글

man writing on paper

2024년 2월 16일

더 나은 폼을 만드는 몇 가지 팁

assorted files

2024년 1월 5일

개발시 내용을 정확히 반영하는 변수명을 사용하는 것은 아주 중요합니다

2023년 4월 13일

CSS가 어려운 이유 — 프로젝트 중심 실전 CSS 강의 소개

2023년 1월 15일

워드프레스, 답답한 빌더와 플러그인 대신 시원하게 커스터마징하기(강의)

2018년 10월 13일

아무도 말하지 않는 PHP의 좋은 점

2016년 12월 20일

유지보수하기 쉬운 CSS 전략(슬라이드)

2013년 5월 12일

워드프레스 테마에서 템플릿 파일 매칭 순서

white smartphone on two softbound books

2013년 1월 1일

CSS 코드 냄새

“ckeditor, 자바스크립트로 내용 집어넣기(전체 내용 바꾸기)”에 대한 4개의 응답

  1. 건호형

    매번 찾게 되는 내용이라서
    제 블로그에 링크 퍼가겠습니다

    응답
    1. 녹풍(綠風)

      방문 감사합니다.
      그런 경우라면 퍼가시되 비공개 글로 해 두시면 되겠습니다.

      응답
  2. php개발자

    찾던 내용인데 다른곳에 없엇는데 잘되네요 감사합니다 (__)

    응답
    1. 안형우

      넵 :)

      응답

php개발자 에 응답 남기기응답 취소