복붙노트

[JQUERY] 텍스트 () 및 HTML () : JQuery와의 차이는 무엇입니까?

JQUERY

텍스트 () 및 HTML () : JQuery와의 차이는 무엇입니까?

해결법

  1. 1.나는 차이가 거의 설명이 필요하다고 생각합니다. 그리고 시험에 슈퍼 사소한.

    나는 차이가 거의 설명이 필요하다고 생각합니다. 그리고 시험에 슈퍼 사소한.

    jQuery.html ()는 HTML, jQuery.text와 같은 문자열을 () 취급 텍스트로 내용을 취급

    <html>
<head>
  <title>Test Page</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <script type="text/javascript">
    $(function(){
      $("#div1").html('<a href="example.html">Link</a><b>hello</b>');
      $("#div2").text('<a href="example.html">Link</a><b>hello</b>');
    });
  </script>
</head>

<body>

<div id="div1"></div>
<div id="div2"></div>

</body>
</html>

    그리 명확하지 않을 수의 차이는 jQuery를 API 문서에 설명되어 있습니다

    () 또는 .html 문서에서 :

    그리고는 .text에 대한 문서에서 () :

    () {(기능 $ $ ( "#의 div1") HTML ( ' 링크 헬로 .'); $ ( "#의 DIV2") 텍스트 ( ' 링크 안녕하세요 .'); }); <스크립트 SRC = "https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">

    http://jsfiddle.net/hossain/sUTVg/에 라이브 데모

  2. 2.(필요한 경우 ()이 대답은 위키입니다, 업데이트하시기 바랍니다)

    (필요한 경우 ()이 대답은 위키입니다, 업데이트하시기 바랍니다)

    답 : .html 중에서 () 빠르다! 여기에 모든 질문에 대해 "행동 테스트 키트"를 참조하십시오.

    그래서, 결론에서, 당신은 "단지 텍스트"를 사용 HTML () 메소드가있는 경우.

    참고 :합니까이 이해가되지? .html 중에서 () 함수는 .innerHTML에 래퍼이지만,는 .text () 함수에서 jQuery를가 "엔티티 필터"를 추가하고,이 필터는 자연적으로 시간을 소비하는 것을 기억하십시오.

    당신이 정말로 성능을 원한다면 좋아, ...를 사용하여 순수 자바 스크립트 액세스에 직접 nodeValue를 속성으로 텍스트-교체합니다. 벤치 마크 결론 :

    PS이 : .textContent 속성은 DOM 레벨 3에 도입 된, .NodeValue 이렇게는 DOM 수준-2이고 빠른 (!).

    이 완전한 벤치 마크를 참조하십시오 :

    // Using jQuery:
simplecron.restart(); for (var i=1; i<3000; i++) 
    $("#work").html('BENCHMARK WORK');
var ht = simplecron.duration();
simplecron.restart(); for (var i=1; i<3000; i++) 
    $("#work").text('BENCHMARK WORK');
alert("JQuery (3000x): \nhtml="+ht+"\ntext="+simplecron.duration());

// Using pure JavaScript only:
simplecron.restart(); for (var i=1; i<3000; i++)
    document.getElementById('work').innerHTML = 'BENCHMARK WORK';
ht = simplecron.duration();
simplecron.restart(); for (var i=1; i<3000; i++) 
    document.getElementById('work').nodeValue = 'BENCHMARK WORK';
alert("Pure JS (3000x):\ninnerHTML="+ht+"\nnodeValue="+simplecron.duration());

  3. 3.두 번째 예는 그들의 대응하는 문자 엔티티 요소와 관련된 문자의 교환에 의해 텍스트를 탈출하는 반면 첫 번째 예 (실제로 렌더링되지 즉 HTML 표시한다)이 그대로 표시되도록 사업부 내에 HTML을 포함 할 것이다.

    두 번째 예는 그들의 대응하는 문자 엔티티 요소와 관련된 문자의 교환에 의해 텍스트를 탈출하는 반면 첫 번째 예 (실제로 렌더링되지 즉 HTML 표시한다)이 그대로 표시되도록 사업부 내에 HTML을 포함 할 것이다.

  4. 4.텍스트 () 메소드는 그것으로 전달되는 모든 HTML을 엔티티 - 이스케이프합니다. 를 사용하여 텍스트 () 페이지를 볼 사람들이 볼 수 HTML 코드를 삽입 할 때.

    텍스트 () 메소드는 그것으로 전달되는 모든 HTML을 엔티티 - 이스케이프합니다. 를 사용하여 텍스트 () 페이지를 볼 사람들이 볼 수 HTML 코드를 삽입 할 때.

    기술적으로, 두 번째 예는 생산 :

    &lt;a href="example.html"&gt;Link&lt;/a&gt;&lt;b&gt;hello&lt;/b&gt;

    이는 브라우저로 렌더링 될 것입니다 :

    <a href="example.html">Link</a><b>hello</b>

    첫 번째 예는 실제 링크 및 일부 굵은 텍스트로 렌더링됩니다.

  5. 5.사실 모두 다소 비슷한 모양을 할 수 있지만, 그것은 당신의 사용 또는 당신이 무엇을 달성하고자하는 의도에 따라 매우 다르다,

    사실 모두 다소 비슷한 모양을 할 수 있지만, 그것은 당신의 사용 또는 당신이 무엇을 달성하고자하는 의도에 따라 매우 다르다,

    행동의 차이를 볼 수 jsfiddle에이 예제를 확인

  6. 6.이상한은 아무도의 크로스 사이트 스크립팅 방지 효과를 언급 없다고는 .text () 이상 .html 중에서 () (다른 사람이 단지는 .text ()는 데이터를 탈출 언급했지만).

    이상한은 아무도의 크로스 사이트 스크립팅 방지 효과를 언급 없다고는 .text () 이상 .html 중에서 () (다른 사람이 단지는 .text ()는 데이터를 탈출 언급했지만).

    항상 당신이 바로 데이터 / 사용자에게 표시 할 텍스트입니다 DOM에서 데이터를 업데이트하려고 할 때 ()는 .text 사용하는 것이 좋습니다.

    .html 중에서 () 대부분 사업부 내에서 HTML 콘텐츠를 가져 오는 데 사용되어야한다.

  7. 7.간단한 텍스트로 값을 표시하고자 할 때 (...)는 .text 사용합니다.

    간단한 텍스트로 값을 표시하고자 할 때 (...)는 .text 사용합니다.

    사용 .html 중에서 (...) 당신은 HTML 형식의 텍스트 (또는 HTML 콘텐츠)와 같은 값을 표시하고자 할 때.

    당신이 당신의 텍스트 (예를 들어, 입력 컨트롤에서 오는) 것을하지 않도록있을 때 당신은 확실히 문자 / HTML에서 특별한 의미를 가지고 태그를 포함하지 않는 (...)는 .text 사용해야합니다. 이 제대로 표시되지 않습니다 텍스트 초래할 수 있지만, 그것은 또한 원치 않는 JS 스크립트 코드 조각 (예를 들어, 다른 사용자의 입력에서 오는)가 활성화 될 수 있음을 일으킬 수 있기 때문에 정말 중요합니다.

  8. 8.는 .text ()는 당신에게 HTML 태그 사이의 실제 텍스트를 제공 할 것입니다. 예를 들어, P 태그 사이의 단락 텍스트. 어떤 흥미 롭다 것은 당신이 $ 선택 플러스가 선택한 요소의 아이 요소의 모든 텍스트와 함께 대상으로하는 요소의 모든 텍스트를 줄 것입니다. 당신이 본문 요소 내부의 텍스트 여러 페이지 태그를 가지고 당신이 $ (몸)는 .text을 그래서 경우 (), 모든 단락에서 모든 텍스트를 얻을 것이다. (텍스트 만이 아닌 p는 자신을 태그.)

    는 .text ()는 당신에게 HTML 태그 사이의 실제 텍스트를 제공 할 것입니다. 예를 들어, P 태그 사이의 단락 텍스트. 어떤 흥미 롭다 것은 당신이 $ 선택 플러스가 선택한 요소의 아이 요소의 모든 텍스트와 함께 대상으로하는 요소의 모든 텍스트를 줄 것입니다. 당신이 본문 요소 내부의 텍스트 여러 페이지 태그를 가지고 당신이 $ (몸)는 .text을 그래서 경우 (), 모든 단락에서 모든 텍스트를 얻을 것이다. (텍스트 만이 아닌 p는 자신을 태그.)

    .html 중에서 () 당신에게 텍스트와 태그를 제공 할 것입니다. 그래서 $ (몸) .html 중에서 () 기본적으로 당신에게 당신의 전체 페이지의 HTML 페이지를 제공합니다

    .val ()는 이러한 입력 값과 같은 특성을 가진 소자를 위해 작동한다. 입력이는 .text 따라서 텍스트 나 HTML 등을 포함하지 않는 () 및 .html 중에서 () 모두 입력 요소에 null가됩니다.

  9. 9.기본적으로, $ ( "# div에"). HTML은 element.innerHTML는 설정 내용을 사용하고, $ ( "# div에"). 텍스트는 (아마도) element.textContent을 사용합니다.

    기본적으로, $ ( "# div에"). HTML은 element.innerHTML는 설정 내용을 사용하고, $ ( "# div에"). 텍스트는 (아마도) element.textContent을 사용합니다.

    http://docs.jquery.com/Attributes/html:

    Set the html contents of every matched element

    http://docs.jquery.com/Attributes/text:

    Similar to html(), but escapes HTML (replace "<" and ">" with their HTML 
entities).

  10. 10.$ ( '. DIV'). html로 (발) 선택된 모든 요소의 HTML 값을 설정합니다, $ ( '. DIV'). 텍스트 (발) 선택된 모든 요소의 텍스트 값을 설정합니다.

    $ ( '. DIV'). html로 (발) 선택된 모든 요소의 HTML 값을 설정합니다, $ ( '. DIV'). 텍스트 (발) 선택된 모든 요소의 텍스트 값을 설정합니다.

    jQuery.text에 대한 API 문서 ()

    jQuery.html에 대한 API 문서 ()

    나는 그들이 각각 노드 #는 TextContent 및 요소 # innerHTML을에 대응 추측 것입니다. (게코 DOM 참조).

  11. 11.그럼 간단한 용어이다.

    그럼 간단한 용어이다.

    HTML () - 내부 HTML (HTML 태그 및 텍스트)을 얻을 수 있습니다.

    텍스트 () - 텍스트 만 얻을 수있는 내부 (텍스트 만)의 경우

  12. 12.서로 다른는 ()를 .html 텍스트로 HTML,는 .text () avaluate로 평가합니다. HTML의 블록을 고려 HTML

    서로 다른는 ()를 .html 텍스트로 HTML,는 .text () avaluate로 평가합니다. HTML의 블록을 고려 HTML

    <div id="mydiv">
<div class="mydiv">
    This is a div container
    <ul>
      <li><a href="#">Link 1</a></li>
      <li><a href="#">Link 2</a></li>
    </ul>
    a text after ul
</div>
</div>

    JS

    var out1 = $('#mydiv').html();
var out2 = $('#mydiv').text();
console.log(out1) // This output all the html tag
console.log(out2) // This is output just the text 'This is a div container Link 1 Link 2 a text after ul'

    그림은이 링크 http://api.jquery.com/text/에서입니다

  13. 13.나는 차이가 HTML 태그를 삽입 할 수 있다고 생각 텍스트 ()는 html로 태그에없는 기능을

    나는 차이가 HTML 태그를 삽입 할 수 있다고 생각 텍스트 ()는 html로 태그에없는 기능을

    $('#output').html('You are registered'+'<br>'  +'  '
                     + 'Mister'+'  ' + name+'   ' + sourname ); }

    출력 :

    You are registered <br> Mister name sourname

    ) (HTML 텍스트 ()를 대체

    산출

    You are registered
Mister name sourname

    HTML에서 다음 태그로
    작품 ()

  14. 14.텍스트 기능 설정 또는 일반 텍스트로 값을 검색, 그렇지 않으면 HTML 기능을 설정 또는 변경에 HTML 태그로 값을 검색하거나 수정합니다. 그냥 내용을 변경하려면 다음 텍스트를 ()를 사용합니다. 그런 다음 마크 업을 변경해야하는 경우하지만 당신은) (HMTL를 사용해야합니다.

    텍스트 기능 설정 또는 일반 텍스트로 값을 검색, 그렇지 않으면 HTML 기능을 설정 또는 변경에 HTML 태그로 값을 검색하거나 수정합니다. 그냥 내용을 변경하려면 다음 텍스트를 ()를 사용합니다. 그런 다음 마크 업을 변경해야하는 경우하지만 당신은) (HMTL를 사용해야합니다.

    그것은 6 년 후, 음주 신경 쓰지 나를 위해 더미 응답입니다.

  15. 15.

    **difference between text()&& html() && val()...?
#Html code..
<select id="d">
<option>Hello</option>
<option>Welcome</option>
</select>
# jquery code..
$(document).ready(function(){
   $("#d").html();
   $("#d").text();
   $("#d").val();

});

  16. 16.

    var v = "&#x5168;&#x540D;";
$("#div").html(v); //display as "全名"
$("#div").text(v); //display as "&#x5168;&#x540D;"

    텍스트 () -이 방법을 설정하거나 반환 선택한 요소의 텍스트 내용. HTML () -이 방법은 세트 또는 복귀 선택된 원소의 함량. 여기에 예를 참조하십시오 https://www.tutorialspoint.com/online_jquery_editor.php

    17. from https://stackoverflow.com/questions/1910794/what-is-the-difference-between-jquery-text-and-html by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] jQuery를 1.9 .live ()는 함수가 아니다  (0) 2020.09.27
[JQUERY] 업로드하기 전에 파일 크기, 이미지의 폭과 높이를 가져옵니다  (0) 2020.09.27
[JQUERY] jQuery를에 CSS 클래스 변경에 발사 이벤트  (0) 2020.09.27
[JQUERY] jQuery를에 입력 변화를 감지?  (0) 2020.09.27
[JQUERY] jQuery를 사용하여 <선택>에 옵션을 추가?  (0) 2020.09.27
,

티스토리툴바