WebKit contentEditable 복사 - 붙여 넣기를 피하여 원하지 않는 CSS가 발생합니까?

Question

contentEditable="true" 인 <div>이 있습니다.

편집 가능한 div에 콘텐츠를 복사하여 붙여 넣으면 붙여 넣기 된 텍스트가 원치 않는 CSS가 많이 포함됩니다. 예를 들어

이 : <p>text text</p> 이된다 :

이

<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; outline-width: 0px; outline-style: initial; outline-color: initial; font-size: 17px; vertical-align: baseline; background-image: initial; background-attachment: initial; background-origin: initial; background-clip: initial; background-color: transparent; background-position: initial initial; background-repeat: initial initial; ">text text</p> 

내가 (현재의 경우 구글 크롬) 브라우저를 이해는 똑똑하고 모든 일을 시도,하지만 나는 결국 완전히 관련이없는 원치 않는 것입니다 CSS.

WebKit 기반 브라우저에 이 아니라고 알려주는 방법이 있습니까?은 이것을 생성합니까?

Answer 1

나는 모든 브라우저가 다른 HTML을 생성한다는 문제와 동일한 문제가있었습니다. 그래서 Sanitize 라이브러리의 JavaScript 포트를 작성했습니다. Sanitize.js

Sanitize.js는 JavaScript로 작성된 허용 된 사이트 기반 HTML 위생 도구입니다. 허용되는 요소 및 속성 목록이 제공되면 Sanitize.js는 DOM 노드에서 허용되지 않는 HTML을 모두 제거합니다.

예를 들어 여기서 paste 이벤트를 캡처하고 HTML을 처리하십시오.