innerText innerHTML 사용법 및 주의사항 [권장]_javascript 기술

1: 텍스트와 HTML을 동적으로 변경합니다

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>데모1</title> <style type="text/css"> p { color:gray; } </style> <p> </p> <p>아래 텍스트를 클릭해주세요... </p> <ul> <li id="DT" onclick="changeText()"> </li>잘 지내세요?<li id="DH" onclick="changeHtml()"> </li>당신의 성은 무엇입니까?<li onclick="back()"> </li>원래 상태로 복원</ul>
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.

]

innerText 속성은 출력할 텍스트를 정의하는 데 사용됩니다. 이 예에서 innerText는 개체 DT의 "How are you?" 텍스트를 "I'm Fine!"으로 변경합니다. 난 괜찮아!"). innerHTML 속성은 DH 객체를 변경하는 데 사용됩니다. innerText의 기능 외에도 DH 객체 내부의 HTML 문도 변경할 수 있으므로 텍스트를 "My last name is Xiao!"로 변경하고 텍스트 출력은 다음과 같습니다. 기울임꼴()로 변경하고 아래에 직선()을 추가합니다. 즉, DH.innerHTML="". 외부텍스트와 외부HTML도 비슷한 기능을 갖고 있으므로 독자들이 직접 시도해 볼 수도 있습니다.
2: 텍스트의 동적 입력 및 출력

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> </title>데모2<style type="text/css"> p { color:gray; } body { font-family:宋体; color:blue; font-size:9pt; } .blue { color:blue; font-size:9pt; } </style> <form id="frm"> <p> <input type="text" name="txt" size="50"> <input type="button" value="输出文本" class="blue" onclick="OutputText()"> 텍스트 상자에 텍스트를 입력하세요. </p> <p id="output"> </p> </form> 여기에 텍스트 출력:
[Ctrl A 모두 선택 참고:

외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]
이 예의 효과는 먼저 텍스트 상자에 텍스트를 입력한 다음 "텍스트 출력" 버튼을 누르면 웹 페이지가 입력한 텍스트를 자동으로 출력하는 것입니다.
3: innerHTML에는 자동 자동으로 구문 검사 기능 HTML 코드가 완전히 완성되었습니다. 이는 마술적이라고 할 수 있습니다

예를 들어 다음 스크립트 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> </title> 데모3 <p id="tab" onclick="Get()"> </p> 저를 클릭해주세요!!!

[Ctrl A 모두 선택 참고:
외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.
]

달리기의 효과는 다음과 같습니다:
그림과 같이:

그러므로 사용 시 주의하시기 바랍니다. 예를 들어 이러한 작업을 수행하면 오류가 발생합니다. 코드를 복사하세요. >

코드는 다음과 같습니다.


list.innerHTML="" list.innerHTML="

"
중간 변수를 사용해야 합니다
HTML 코드

코드 복사 코드는 다음과 같습니다

var html=""
html ="html ="

"
list.innerHTML=html; ;

";
list.innerHTML=html;

이 방법으로 문제를 해결할 수 있습니다.
또한:
innerText in Firefox에서는 지원되지 않습니다.
innerHTML은 W3C 표준을 준수하는 속성이며 innerText는 IE 브라우저에만 적용 가능합니다. HTML 태그 없이 콘텐츠를 출력하려면 innerHTML을 사용하여 HTML 태그가 포함된 콘텐츠를 가져온 다음 정규식을 사용하여 HTML 태그를 제거할 수 있습니다. 다음은 W3C 표준을 준수하는 간단한 예입니다. a href="javascript :alert(document.getElementById('test').innerHTML.replace(/<.>/gim,''))">HTML 없음, W3C 표준 준수