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

[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;

}

 



분류 제목
image HTML - <canvas> 태그 - 그림그리기 (= canvas태그 = 캔버스태그)
attribute HTML - pattern 속성 - 유효한 입력값인지 정규표현식 패턴 검사 (= pattern속성 = 패턴속…
programming HTML - <applet> 태그 - 애플릿 (= applet태그 = 애플릿태그)
list HTML - <menuitem> 태그 - 마우스오른쪽 팝업메뉴 (= menuitem태그 = 메뉴아이템태그) …
formatting HTML - <dfn> 태그 - 용어 정의 (= dfn태그 = 드픈태그 = 디파인태그)
list HTML - <dd> 태그 ★ - 설명리스트의 설명항목 내용 (= dd태그 = 디디태그) ※ (정의리스트/데…
list HTML - <dir> 태그 - 디렉토리목록 (= dir태그 = 디르태그 = 디렉토리태그) (HTML5제외)
api HTML5 - Web Worker - 백그라운드실행JS (= 웹워커)
list HTML - <dl> 태그 ★ - 설명리스트 (= 설명목록 = dl태그 = 디엘태그) (HTML5용도변경) …
style HTML - <dialog> 태그 - 대화박스 (= 대화상자 = dialog태그 = 다이알로그태그) (HTM…
font HTML - <tt> 태그 - 동일너비의 작은글씨 (= 티티태그) (HTML5제외)
style HTML - <summary> 태그 - 세부사항의 머리글 (= summary태그 = 서머리태그 = 써머리태…
form HTML - <keygen> 태그 - 암호화쌍키생성 (= keygen태그 = 키젠태그)
attribute HTML - hidden 속성 - 요소 숨기기 (= hidden속성 = 히든속성)
formatting HTML - <acronym> 태그 - 두문자어 (= acronym태그 = acronym요소 = 애크로님태그…
formatting HTML - <kbd> 태그 - 키보드입력키 표시. (= kbd태그 = 키보드태그)
meta HTML - <head> 태그 ★ - 문서정보정의 (= head태그 = 헤드태그) (HTML5에서 속성 지원…
attribute HTML - Attribute ★ - 속성종류 (= 전역속성 + 이벤트속성 + 그외속성)
intro HTML - HTML5 사용조건 / HTML4.01과 다른점 (= HTML5 vs HTML401 차이점)
formatting HTML - <abbr> 태그 - 축약어/두문자어 (= abbr태그 = abbr요소 = 어브르태그 = 어브리…
12/18
목록
찾아주셔서 감사합니다. Since 2012