HTML 문자열에서 부모 div를 제거하지만 내용은 유지

톰 헤스턴

jQuery를 사용할 수있는 JS 파일의 문자열에 다음 HTML이 있습니다. 'fr-wrapper'div를 제거하고 div도 제거 'fr-element'하지만 내부 내용은 그대로 두려면 어떻게해야합니까?

실물:

<div class="pixer content row fr-box fr-inline">
        <div class="fr-wrapper" dir="auto">
            <div aria-disabled="false" class="fr-element fr-view" contenteditable="true" dir="auto" spellcheck="false">
                <div class="top-mid-float">
                    <div id="main-inner-header">
                        <h1><strong>Hello there!</strong></h1>
                    </div>
                    <div id="lower-content-header">
                        <p>Quisque tincidunt nunc in lacus consectetur, et pharetra velit pulvinar. Quisque id egestas tellus, vitae venenatis tellus. Etiam accumsan iaculis sem, in vestibulum odio tincidunt vel. Etiam justo massa, congue vulputate dui.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

내가 목표로하는 것 :

<div class="pixer content row fr-box fr-inline">
    <div class="top-mid-float">
        <div id="main-inner-header">
            <h1><strong>Hello there!</strong></h1>
        </div>
        <div id="lower-content-header">
            <p>Quisque tincidunt nunc in lacus consectetur, et pharetra velit pulvinar. Quisque id egestas tellus, vitae venenatis tellus. Etiam accumsan iaculis sem, in vestibulum odio tincidunt vel. Etiam justo massa, congue vulputate dui.</p>
        </div>
    </div>
</div>

동적이기 때문에의 내용 top-mid-float은 항상 다릅니다.

이것은 문자열에 있지만 DOM에서 가져 와서 수행하는 솔루션이 있으면 작업 할 수 있습니다.

KevBot

의 하위 항목을 저장하고 fr-element div행에서 모든 항목을 제거한 다음 하위 항목을 다시 추가 할 수 있습니다.

var $row = $('<div class="content fr-box fr-inline pixer row"><div class=fr-wrapper dir=auto><div class="fr-element fr-view"dir=auto aria-disabled=false contenteditable=true spellcheck=false><div class=top-mid-float><div id=main-inner-header><h1><strong>Hello there!</strong></h1></div><div id=lower-content-header><p>Quisque tincidunt nunc in lacus consectetur, et pharetra velit pulvinar. Quisque id egestas tellus, vitae venenatis tellus. Etiam accumsan iaculis sem, in vestibulum odio tincidunt vel. Etiam justo massa, congue vulputate dui.</div></div></div></div></div>');

var children = $row.find('.fr-element').children();
$row.empty().append(children);

// If you want to add the result somewhere
$('body').html($row);

// Or, to turn the modified result back into an HTML string
var finalHTMLString = $row.wrapAll('<div>').parent().html();
console.log(finalHTMLString);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

부모 폴더를 제거하지만 자식의 내용은 유지

분류에서Dev

jquery를 사용하여 div를 제거하지만 내부에 div 유지

분류에서Dev

HTML 요소를 제거하지만 내용은 유지

분류에서Dev

모든 빈 자식 노드를 제거하지만 부모 수준은 유지하는 XML 스타일 시트

분류에서Dev

div를 사용하여 만든 HTML 버튼에서 지방 제거

분류에서Dev

문자열에서 html 태그를 제거하지만 복원 \ n

분류에서Dev

SSIS 파생 열은 문자열에서 텍스트를 제거하고 숫자 값만 유지합니다.

분류에서Dev

큰 문자열 목록 (R)에서 문자열의 일부에서만 쉼표를 감지하고 제거

분류에서Dev

ng-repeat에서 요소를 제거하지만 HTML은 dom에 유지하십시오.

분류에서Dev

RegEx를 사용하지 않고 Python 문자열의 시작 부분에서 알파벳이 아닌 모든 문자를 제거하십시오.

분류에서Dev

태그 사이의 실제 텍스트에서 '<'문자를 제거하지 않고 정규식을 사용하여 문자열에서 HTML 태그 제거

분류에서Dev

열의 모든 행에서-번째 문자를 제거하지만 숫자 뒤에 오는 경우에만

분류에서Dev

XSLT 노드를 제거하지만 내용은 유지

분류에서Dev

일부 열에서 중복 값을 제거하지만 행은 유지

분류에서Dev

jQuery HTML 요소를 제거하지만 내용은 그대로 둡니다.

분류에서Dev

Kotlin 명령 문자열과 유사한 내부 따옴표를 유지하면서 Swift String에서 주변 따옴표를 제거합니다.

분류에서Dev

선택한 부모에서 자식 노드를 제거하지만 손녀는 제거하지 마십시오.

분류에서Dev

div를 추가하지만 뷰포트 내부에 유지

분류에서Dev

일부 구분자를 유지하지만 다른 구분자를 제거하는 문자열 분할

분류에서Dev

bash-모든 디렉토리 (및 내용)를 제거하지만 pwd의 파일은 제거하지 않음

분류에서Dev

정규식 : "또는"정규식을 사용하여 문자열에서 여러 단어를 제거하면 일부 단어가 제거되지만 전부는 제거되지 않습니다.

분류에서Dev

부모-자식-부모 범위를 부모 내에 유지하는 방법은 무엇입니까?

분류에서Dev

html 양식에서 json 문자열로 객체를 보내야하지만 문자열이 있습니다.

분류에서Dev

html 양식에서 json 문자열로 객체를 보내야하지만 문자열이 있습니다.

분류에서Dev

HTML 태그를 사용하여 문자열에서 부분 문자열 추출

분류에서Dev

부모 요소를 제거하고 Thymeleaf에 자식 요소를 유지하는 방법은 무엇입니까?

분류에서Dev

다른 부모 html 요소에 의해 래핑되지 않은 본문 태그에서 원하는 요소를 직접 제거하십시오.

분류에서Dev

tr을 사용하여 문자를 제거하지만 줄 바꿈 유지

분류에서Dev

tr을 사용하여 문자를 제거하지만 줄 바꿈 유지

Related 관련 기사

  1. 1

    부모 폴더를 제거하지만 자식의 내용은 유지

  2. 2

    jquery를 사용하여 div를 제거하지만 내부에 div 유지

  3. 3

    HTML 요소를 제거하지만 내용은 유지

  4. 4

    모든 빈 자식 노드를 제거하지만 부모 수준은 유지하는 XML 스타일 시트

  5. 5

    div를 사용하여 만든 HTML 버튼에서 지방 제거

  6. 6

    문자열에서 html 태그를 제거하지만 복원 \ n

  7. 7

    SSIS 파생 열은 문자열에서 텍스트를 제거하고 숫자 값만 유지합니다.

  8. 8

    큰 문자열 목록 (R)에서 문자열의 일부에서만 쉼표를 감지하고 제거

  9. 9

    ng-repeat에서 요소를 제거하지만 HTML은 dom에 유지하십시오.

  10. 10

    RegEx를 사용하지 않고 Python 문자열의 시작 부분에서 알파벳이 아닌 모든 문자를 제거하십시오.

  11. 11

    태그 사이의 실제 텍스트에서 '<'문자를 제거하지 않고 정규식을 사용하여 문자열에서 HTML 태그 제거

  12. 12

    열의 모든 행에서-번째 문자를 제거하지만 숫자 뒤에 오는 경우에만

  13. 13

    XSLT 노드를 제거하지만 내용은 유지

  14. 14

    일부 열에서 중복 값을 제거하지만 행은 유지

  15. 15

    jQuery HTML 요소를 제거하지만 내용은 그대로 둡니다.

  16. 16

    Kotlin 명령 문자열과 유사한 내부 따옴표를 유지하면서 Swift String에서 주변 따옴표를 제거합니다.

  17. 17

    선택한 부모에서 자식 노드를 제거하지만 손녀는 제거하지 마십시오.

  18. 18

    div를 추가하지만 뷰포트 내부에 유지

  19. 19

    일부 구분자를 유지하지만 다른 구분자를 제거하는 문자열 분할

  20. 20

    bash-모든 디렉토리 (및 내용)를 제거하지만 pwd의 파일은 제거하지 않음

  21. 21

    정규식 : "또는"정규식을 사용하여 문자열에서 여러 단어를 제거하면 일부 단어가 제거되지만 전부는 제거되지 않습니다.

  22. 22

    부모-자식-부모 범위를 부모 내에 유지하는 방법은 무엇입니까?

  23. 23

    html 양식에서 json 문자열로 객체를 보내야하지만 문자열이 있습니다.

  24. 24

    html 양식에서 json 문자열로 객체를 보내야하지만 문자열이 있습니다.

  25. 25

    HTML 태그를 사용하여 문자열에서 부분 문자열 추출

  26. 26

    부모 요소를 제거하고 Thymeleaf에 자식 요소를 유지하는 방법은 무엇입니까?

  27. 27

    다른 부모 html 요소에 의해 래핑되지 않은 본문 태그에서 원하는 요소를 직접 제거하십시오.

  28. 28

    tr을 사용하여 문자를 제거하지만 줄 바꿈 유지

  29. 29

    tr을 사용하여 문자를 제거하지만 줄 바꿈 유지

뜨겁다태그

보관