• 회원가입
  • 로그인
  • 구글아이디로 로그인

[programming] HTML - <noscript> 태그 - JS 작동안될때 보여줄 내용 (= noscript태그 = 노스크립트태그) ※ 스크립트 안 주석

목차
  1. <noscript> 예제 - JS 작동 안 될 때 메세지
  2. <noscript> 정의
  3. <noscript> 구문
  4. <noscript> 예제 - 그누보드 goto_url() 함수

 

<noscript> 예제 - JS 작동 안 될 때 메세지

 

<p id="sinbi"></p>

 

<script>

document.getElementById("sinbi").innerHTML = "홈짱닷컴 (homzzang.com)";

</script>

 

 <noscript>

자바스크립트도 안 되는 거 보니, 님 브라우저 너무 후짐.ㅡㅡ;; 

당장 바꾸삼.  ~~ By. 홈짱 (homzzang)

</noscript>

 

결과보기

 

<noscript> 정의

 

<script> 태그 안 JS 내용이 접속자 브라우저에서 작동 안 될 경우 대비해 보여줄 내용 기술.

 



1. 

  • <noscript> 태그는 <head> 태그 내부나 <body> 태그 내부에서 모두 사용 가능. 
  • <noscript> 태그가 <head> 태그 내부에 사용될 경우,  그 내부에 <link> <style> <meta> 요소도 포함해야 함.
  • <noscript> 태그 안 내용은 <script> 태그 안의 JS가 작동 않거나, 클라이언트 브라우저가 지원 안 될 때 출력됨. 
  • 전역속성 지원.

 

2. <script> 태그 안 JS 미지원 브라우저 대비해, 주석 태그 이용 권장. (※ 내용 출력 X)

 

<script>

<!--

function displayMsg() {

    alert("Hello World!")

}

//-->

</script>


3-1.  HTML 4.01과 HTML5에서의 차이 

  • HTML4.01 : <body> 태그 내부에서만 사용 가능.
  • HTML5      : <body> 태그 내부 뿐만 아니라, <head> 태그 내부에서도 사용 가능.


3-2. HTML과 XHTML에서의 차이

  • HTML : <noscript> 태그 지원 O
  • XHTML : <noscript> 태그 지원 X

 

4. 

IE11 이상 주요 최신 브라우저 모두 지원.

 

5. MDN <noscript> 예제보기

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/noscript

 

 

<noscript> 구문

 

<noscript>스크립트 태그 미지원 시 출력할 내용</noscript>

 

 

<noscript> 예제 - 그누보드 goto_url() 함수

위치: /lib/common.lib.php 약 96라인

 

// 메타태그를 이용한 URL 이동

// header("location:URL") 을 대체

function goto_url($url)

{

    $url = str_replace("&amp;", "&", $url);

    //echo "<script> location.replace('$url'); </script>";


    if (!headers_sent())

        header('Location: '.$url);

    else {

        echo '<script>';

        echo 'location.replace("'.$url.'");';

        echo '</script>';

        echo '<noscript>';

        echo '<meta http-equiv="refresh" content="0;url='.$url.'" />';

        echo '</noscript>';

    }

    exit;

}

 



분류 제목
list HTML - <dir> 태그 - 디렉토리목록 (= dir태그 = 디르태그 = 디렉토리태그) (HTML5제외)
list HTML - <dl> 태그 ★ - 설명리스트 (= 설명목록 = dl태그 = 디엘태그) (HTML5용도변경) …
list HTML - <menu> 태그 - 명령어메뉴목록 (= menu태그 = 메뉴태그)
list HTML - <dt> 태그 ★ - 설명리스트의 설명항목 (= dt태그 = 디티태그) ※ (정의리스트/데이터리…
list HTML - <dd> 태그 ★ - 설명리스트의 설명항목 내용 (= dd태그 = 디디태그) ※ (정의리스트/데…
table HTML - <table> 태그 ★ 테이블 (= 표작성 = table태그 = 테이블태그) ※ 셀병합 (= 셀…
table HTML - <caption> 태그 - 테이블제목 (= 표제목 = caption태그 = 캡션태그) (HTML…
table HTML - <tr> 태그 ★ - 테이블행 (= 테이블가로줄 = tr태그 = 티알태그) (HTML5수정)</…
table HTML - <th> 태그 ★ - 테이블셀제목 (= th태그 = 티에이치태그) + th고정 (= 테이블헤드고…
table HTML - <td> 태그 ★ - 테이블 데이터 셀 (= 테이블셀 = td태그 = 티디태그) (HTML5수정…
table HTML - <thead> 태그 - 테이블머리글그룹 (= thead태그 = 티헤드태그) (HTML5수정)
table HTML - <tbody> 태그 - 테이블셀그룹 (= 테이블바디 = tbody태그 = 티바디태그) (HTML…
table HTML - <tfoot> 태그 - 테이블꼬릿말그룹 (= 테이블풋 = tfoot 태그 = 티풋태그) (HTM…
table HTML - <col> 태그 - 테이블열그룹 (= col태그 = 콜태그) (HTML5 수정)
table HTML - <colgroup> 태그 - 테이블의 col태그묶음 (= colgroup태그 = 콜그룹태그, H…
style HTML - <style> 태그 ★ - 요소에 CSS스타일적용 (= style태그 = 스타일태그)
style HTML - <div> 태그 ★★★★★ - 영역 지정 (= 섹션 분할 = div태그 = 디브태그 = 디비전태…
style HTML - <span> 태그 ★★★ - 인라인요소그룹 (= span태그 = 스팬태그 = 스판태그)</spa…
meta HTML - <head> 태그 ★ - 문서정보정의 (= head태그 = 헤드태그) (HTML5에서 속성 지원…
basic HTML - <title> 태그 ★ - 웹문서제목 (= title태그 = 타이틀태그)
4/18
목록
찾아주셔서 감사합니다. Since 2012