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

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

}

 



분류 제목
attribute HTML - for 속성 - <label>/<output> 관련 요소 ID 바인딩 지정 (= for속성 = …
attribute HTML - novalidate 속성 - 폼데이터 제출 시, 유효성 평가 생략 (= novalidate속성 …
attribute HTML - ontimeupdate 속성 - (오디오/비디오) 재생위치 변경 시 실행 (= ontimeupd…
attribute HTML - onwheel 속성 - 마우스휠/터치패드휠 움직일 때 실행 (= onwheel속성 = 온휠속성…
attribute HTML - border 속성 - (HTML5 지원 X) 테두리 너비 지정 (= border속성 = 보더속성…
attribute HTML - value 속성 ★★★ - 요소값 지정 (= value속성 = 밸류속성) ※ 초기값/기본값/현재…
attribute HTML - contenteditable 속성 - 요소 내용 수정 가능 여부 지정 (= contentedit…
attribute HTML - formtarget 속성 - 폼데이터 전달할 폼 지정 (= formtarget속성 = 폼타겟속성…
attribute HTML - dirname 속성 - input/textarea 요소의 텍스트 방향 지정 (= dirname속…
attribute HTML - onscroll 속성 ★ - 마우스 스크롤 이벤트 시 실행 (= onscroll속성 = 온스크롤…
attribute HTML - onpaste 속성 - 사용자가 요소에 내용 붙여넣기 시 실행 (= onpaste속성 = 온패스…
attribute HTML - usemap 속성 - 이미지를 이미지맵으로 지정 (= usemap속성 = 유즈맵속성|유스맵속성)
attribute HTML - class 속성 ★★★ - 클래스명 선택자 지정 (= class속성 = 클래스속성)
attribute HTML - bgcolor 속성 - (HTML5 지원 X) 배경색 지정 (= bgcolor속성 = 비지컬러속…
attribute HTML - onfocus 속성 ★ - 포커스 설정 시 실행 (= onfocus속성 = 온포커스속성) ※ o…
attribute HTML - data 속성 - <object> 태그의 리소스 URL 주소 지정 (= data속성 = 데이터속…
form HTML - <input type="range"> 태그 - 지정범위 내 입력값 지정 (= 인풋레인지타입/레인…
attribute HTML - multiple 속성 ★ - 복수 (파일업로드/이메일입력/옵션선택) 허용 (= multiple속…
attribute HTML - target 속성 ★ - (링크된 문서 열 곳 / 폼 제출할 곳) 지정 (= target속성 =…
attribute HTML - maxlength 속성 ★ - 입력 가능한 최대 글자 개수 지정 (= maxlength속성 = …
8/18
목록
찾아주셔서 감사합니다. Since 2012