$ (element) .text() 및 $ (element) .html() 출력을 비교하여 html 태그의 위치를 결정하는 루틴을 작성하려고합니다. 나중에 document.execCommand()를 사용하지 않고 contenteditable에 "strong"및 "em"과 같은 형식 지정 태그를 적용하는 데 사용됩니다. 이 시점에서 필수 charabters가 html 엔티티로 변환됩니까?
나는 각각의 HTML로 변환 할 필요, 즉 비교 작업을하는 등 '>', '<', 그리고 $ (요소)의 '&'는 .text() 출력으로 문자를 실현 엔티티. 방화 광에서 이러한 문자가 innerHTML 속성에서 자동으로 변환되는 것을 볼 수 있습니다. 나는 다른 캐릭터를 시도했다. 따옴표와 움라우트와 같은 것들은 변환되지 않습니다.내 질문은 :
브라우저에서 일관되게 변환되는 그 문자의 필수 세트 (내 생각 엔> 것 < 및 &)이 있습니까? 내 타겟 브라우저는 파이어 폭스와 크롬이며 IE는 없다. 선량에게 감사한다.
이 문자 세트는 jQuery의 .html() 메소드에 의해 존중 받거나 jQuery는 브라우저 간의 차이점을 없애기 위해 자체적으로 수행합니다. 그렇다면 jQuery가 엔티티로 변환하는 핵심 문자의 포괄적 인 목록을 어디에서 찾을 수 있습니까?
또한 설명하십시오의 contentEditable에 내가있는 경우
이 텍스트 단락은 수동으로 입력 :
some text, and some characters >, <, ", &, ', ë
$('p').text()
나에게 줄 것이다 :
some text, and some characters >, <, ", &, ', ë
것이다 $('p').html()
을하면서 나에게 줘.
some text, and some characters >, <, ", &, ', ë
이것은 방화 광 및 크롬 개발자 도구에서 볼 수있는 결과이기도합니다.
따옴표 및 특수 문자는 작동하지 않지만 모든 것이 작동하려면 분명히 <,> 및 &이 필수적입니다.
$('p').html()
의 출력과 태그 자체가 일치하지 않도록 모두 찾기/바꾸기를 통해 $('p').text()
의 결과를 변환하고 싶습니다.
나는 분명히 <,>, 그리고 &과 같은 다른 문자를 알아야 완벽하게 일치하도록 html 엔티티로 변환해야합니다.
이 의미 : 나는 기존의 WYMEditor과 함께 제공 iframe을 의지하지 않고의 contentEditable 사업부 간단한 WYSIWYM 에디터를 구축을 위해 노력하고
.
이것은 제어 된 환경 (내 사용자 지정 CMS)에서 사용되며 HTML 편집기에서 예상되는 기능의 하위 집합을 허용합니다. 기본적으로 전체 내용은 contenteditable div에있는 P, H1-H6 및 UL> LI, OL> LI 태그의 묶음입니다.
콘텐츠 태그 (UL, OL 자식이없는 P, H1-H6 및 LI 태그)에는 STRONG, EM, A, SUB, SUP 및 SPAN 태그 만 포함 할 수 있습니다.
IE를 타겟팅하지 않지만 플랫폼 차이가없는 FF 및 Chrome에서이 기능을 사용하고 싶습니다. 이러한 플랫폼 차이 중 하나는 text.execCommand()가 텍스트를 강조하거나 기울임 꼴로 표시 할 때 수행되는 방식입니다. FF는 선택 사항을 감싸고 크롬은 태그를 사용합니다. 다음과 같은 방법으로 서식을 적용하기로 결정했습니다 :
- 선택 범위를 가져옵니다.
- 범위 내의 모든 "콘텐츠 태그"를 나열하십시오.
- 범위 개체를 사용하고 각 "콘텐츠 태그"와의 관계는 선택 전, 선택 후 및 선택 후 텍스트의 세 가지 청크를 정의합니다. 이들은 특수 문자가 엔티티로 변환되지 않은 직선 텍스트로 제공됩니다.
- 각 "내용 태그"innerhtml에 대해, 나는 각 종류의 태그의 "지도"로 분해하기 위해 문자별로 구문을 분석합니다. 나는 태그의 계층 구조를 확립했다 : a span> sub> strong> em. 이처럼 "지도"입니다 뭔가 : innerHTML을위한
: this <em>is <strong>a</strong></em> <a href="#"><strong>test</strong>
텍스트
text: this is a test text
a: __________XXXXXXXXX
strong: ________X_XXXX_____
em: _____XXXX__________
- 선택하기 전에, 선택 및 선택 텍스트 후를 사용하여뿐만 아니라 포맷 작업, I 다음 마스크를 만드십시오. 예를 들어 경우 '이되어'굵은 글씨 할 필요가 : 마스크는 다음과 같습니다
text: this is a test text strong: XXXXXXX____________
- 지도와 마스크를 조합 한 후, 생성되는 맵은 다음과 같습니다
text: this is a test text a: __________XXXXXXXXX strong: XXXXXXX_X_XXXX_____ em: _____XXXX__________
- 이지도는 HTML로 변환됩니다 :
<strong>this <em>is</em></strong><em> </em><strong><em>a</em></strong> <a href="#"><strong>test</strong>
- 는 "컨테이너 태그"결과 HTML과의 innerHTML을 교체합니다.
이제 내가이 질문을하는 이유는 HTML에서 추출한 텍스트 청크와 범위에 의해 완벽하게 일치하는 텍스트가 필요하다는 것입니다. 그래서 나는 특수 문자를 변환 할 수는 없지만 "필수"문자 만 변환합니다.
이 방법이이 문제를 해결하는 가장 쉽고 빠른 방법은 아닐지 모르지만 저는 시각적 사고를하는 사람입니다. 2 차원 그리드에 문제를 배치하는 것이 크게 도움이됩니다.
답을 보내 주셔서 감사합니다. 추가 질문을 보내 주셔서 감사합니다. 나는 이것을위한 어떤 관련 코드도 없다. 지금까지 – Andri
은 <, > 및 & 문자 만 필수적인 것 같습니다. 수락하기 – Andri
@ 앤드 리 : 내 업데이트를 참조하십시오. – RoToRa