복붙노트

[JQUERY] 어떻게 jQuery를 사용하여 사업부의 innerHTML을 교체하는?

JQUERY

어떻게 jQuery를 사용하여 사업부의 innerHTML을 교체하는?

해결법


  1. 1.

    $("#regTitle").html("Hello World");
    

  2. 2.html로 () 함수는 HTML의 문자열을 할 수 있으며, 효과적으로 .innerHTML 속성을 수정합니다.

    html로 () 함수는 HTML의 문자열을 할 수 있으며, 효과적으로 .innerHTML 속성을 수정합니다.

    $('#regTitle').html('Hello World');
    

    그러나, 텍스트 () 함수는 지정된 요소 (텍스트)의 값을 변경할 수 있지만, HTML 구조를 유지할 것이다.

    $('#regTitle').text('Hello world'); 
    

  3. 3.그런 다음 내용을 재설정하고 새로운를 추가 : 당신이 대신 jQuery를 객체가있는 경우 대신 기존 콘텐츠를 렌더링 할.

    그런 다음 내용을 재설정하고 새로운를 추가 : 당신이 대신 jQuery를 객체가있는 경우 대신 기존 콘텐츠를 렌더링 할.

    var itemtoReplaceContentOf = $('#regTitle');
    itemtoReplaceContentOf.html('');
    newcontent.appendTo(itemtoReplaceContentOf);
    

    또는:

    $('#regTitle').empty().append(newcontent);
    

  4. 4.여기에 귀하의 대답은 :

    여기에 귀하의 대답은 :

    //This is the setter of the innerHTML property in jQuery
    $('#regTitle').html('Hello World');
    
    //This is the getter of the innerHTML property in jQuery
    var helloWorld = $('#regTitle').html();
    

  5. 5.대답:

    대답:

    $("#regTitle").html('Hello World');
    

    설명:

    $는 jQuery를 동일합니다. 모두 jQuery 라이브러리에서 동일한 개체를 나타냅니다. 괄호 안에있는 "#regTitle는"당신이 코드를 적용 할 HTML DOM (문서 객체 모델)의 어떤 요소 (들)을 식별하기 위해 jQuery 라이브러리가 사용하는 선택이라고합니다. regTitle 전에 #은 regTitle는 DOM 내 요소의 id이다 jQuery를 말하고있다.

    거기에서, 점 표기법은이 경우 '안녕하세요'는 괄호 사이에 현재 위치에서 어떤 매개 변수를 사용하여 내부 HTML을 대체 HTML 함수를 호출하는 데 사용됩니다.


  6. 6.요소의 내부 HTML을 변경하는 방법을 제공 답은 이미 있습니다.

    요소의 내부 HTML을 변경하는 방법을 제공 답은 이미 있습니다.

    하지만 난 당신이 아니라 바로 내부 HTML을 변경 변경된 HTML의 좋은 효과를 준다 변경 HTML에 페이드 아웃 / 페이드 인과 같은 몇 가지 애니메이션을 사용한다 건의 할 것입니다.

    $('#regTitle').fadeOut(500, function() {
        $(this).html('Hello World!').fadeIn(500);
    });
    

    당신이 필요한 많은 기능이있는 경우에, 당신은 내부 HTML을 변경 일반적인 함수를 호출 할 수 있습니다.

    function changeInnerHtml(elementPath, newText){
        $(elementPath).fadeOut(500, function() {
            $(this).html(newText).fadeIn(500);
        });
    }
    

  7. 7.당신은 그것을 달성하기 위해 JQuery와에 HTML 또는 텍스트 기능을 사용할 수 있습니다

    당신은 그것을 달성하기 위해 JQuery와에 HTML 또는 텍스트 기능을 사용할 수 있습니다

    $("#regTitle").html("hello world");
    

    또는

    $("#regTitle").text("hello world");
    

  8. 8.예 $ (문서) .ready (함수 () { $ ( '. MSG') HTML ( '안녕하세요 세계.'); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">

    예 $ (문서) .ready (함수 () { $ ( '. MSG') HTML ( '안녕하세요 세계.'); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js">


  9. 9.jQuery를 .html 중에서 () 설정과 일치 비어 있지 않은 요소 (innerHTML을)의 내용을 얻기 위해 사용될 수있다.

    jQuery를 .html 중에서 () 설정과 일치 비어 있지 않은 요소 (innerHTML을)의 내용을 얻기 위해 사용될 수있다.

    var contents = $(element).html();
    $(element).html("insert content into element");
    

  10. 10.

    $("#regTitle")[0].innerHTML = 'Hello World';
    

  11. 11.그냥 몇 가지 성능 통찰력을 추가 할 수 있습니다.

    그냥 몇 가지 성능 통찰력을 추가 할 수 있습니다.

    나는 몇 년 전 우리는 다양한 HTML 요소에 큰 HTML / 텍스트를 설정하려고 문제를 가지고 프로젝트를했다.

    DOM의 콘텐츠를 업데이 트 빠르게 제안 된 방법들보다, 그 요소를 "다시"및 DOM에 주입했다 방법을 나타났다.

    뭔가 같은 :

    변수 텍스트 = "매우 큰 내용"; $ ( "# regTitle") 제거 ().; $ ( "

    '+ 텍스트 +" ") appendTo ('신체 ').; <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">

    당신에게 더 나은 성능을 얻을 수 있습니다. 나는 최근에 (브라우저 요즘 영리해야한다) 그것을 측정하기 위해 시도하지 않은,하지만 당신은 성능을 찾고 있다면 그것은 도움이 될 수 있습니다.

    단점은 당신이 DOM 오른쪽 객체를 가리키는 스크립트에 대한 참조를 유지하기 위해 더 많은 일을해야한다는 것입니다.


  12. 12.jQuery를 사용하면 텍스트 ()를 사용하는 경우, 그것은 당신을 위해 일을 할 것입니다 텍스트 작업, 몇 가지 기능이 있습니다 :

    jQuery를 사용하면 텍스트 ()를 사용하는 경우, 그것은 당신을 위해 일을 할 것입니다 텍스트 작업, 몇 가지 기능이 있습니다 :

    $("#regTitle").text("Hello World");
    

    당신이 어떤 HTML 태그가있는 경우 또한, 당신은 HTML ()를 사용하는 대신 수 있습니다 ...


  13. 13.순수 JS

    순수 JS

    regTitle.innerHTML = 'Hello World'
    

    regTitle.innerHTML = '안녕하세요';

    최단

    $(regTitle).html('Hello World'); 
    

    // 참고 : regTitle 주위에 따옴표 없다 $ (regTitle) .html 중에서 ( '안녕하세요'); <스크립트 SRC = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js">

  14. from https://stackoverflow.com/questions/1309452/how-to-replace-innerhtml-of-a-div-using-jquery by cc-by-sa and MIT license