> 웹 프론트엔드 > JS 튜토리얼 > 초보자를 위한 js 구문의 기본 소개

초보자를 위한 js 구문의 기본 소개

伊谢尔伦
풀어 주다: 2017-06-16 10:16:40
원래의
1291명이 탐색했습니다.

Ajax의 인기와 함께 js는 많은 주목을 받았습니다. js의 가장 큰 장점은 태그 요소 생성, 요소 속성 변경 등을 포함하여 html의 모든 요소에 대해 작업이 가능하다는 것입니다. 이를 통해 js를 사용하여 달성할 수 있습니다. 사용자에게 더욱 강력한 상호 작용을 제공하는 다양한 동적 효과!

초보자를 위한 js 구문의 기본 소개

Js 테스트 방법

Javascript 스크립트를 디버깅할 때 오류가 있으면 IE의 상태 표시줄에 물음표가 표시됩니다. [이 물음표를 클릭하세요. ], 또는 오류 상자가 나타납니다. 가능한 한 빨리 오류를 찾기 위해 일반적으로 사용되는 디버깅 방법은 다음과 같습니다.
1. 개체가 null이거나 개체를 찾을 수 없는 경우 id, name을 의미합니다. 또는 DOM이 올바르게 작성되지 않았습니다. 라인
2.함수 호출에 오류가 있는 경우 함수 본문에 문제가 있음을 의미합니다. 몸.
3.속도를 높이려면 먼저 /* */ 주석을 사용하여 코드 일부를 차단하고 단계별로 확인할 수 있습니다.
4.경고(xxx)를 추가하여 변수가 있는지 확인할 수 있습니다.
5 .IE 오류 보고는 종종 부정확합니다. 예를 들어, 18행이 잘못된 경우 19행에 문제가 있는 경우가 있습니다.
6.코드가 올바르게 실행될 수 있도록 합니다. , 오류가 발생했는지 확실하지 않은 경우 try{ }catch{} 문이 다른 방법을 수행하고 있으므로 계속 추가하세요.

 <script>   
  try{   
        x=y;       //   Cause   an   error.   
  }   
  catch(e){       //   Create   local   variable   e.   
        alert(e);       //   Prints   "[object   Error]".   
        alert(e.number   &   0xFFFF);       //   Prints   5009.   
        alert(e.description);       //   Prints   "&#39;y&#39;   is   undefined".   
  }   
  </script>
로그인 후 복사

모든 항목은 js의 작은 기술이지만 매우 실용적입니다!
1.document.write(""); 출력 문
2. JS의 주석은 //
3입니다. 전통적인 HTML 문서 순서는 document->html->(head,body)
4입니다. 브라우저 창의 DOM 순서는 다음과 같습니다. window->(navigator, screen, History, location, document) 5. 다음 형식으로 요소의 이름과 값을 가져옵니다. document.getElementById("ID 번호 form") .name (또는 value)
6. 소문자를 대문자로 JS: document.getElementById("output").value = document.getElementById("input").value.toUpperCase();
7.Value 입력 JS :String,Number,Boolean,Null,Object,Function
8. JS에서 문자 유형을 숫자 유형으로 변환:parseInt(),parseFloat()
9.JS에서 숫자를 문자 유형으로 변환:(""+variable)
10. JS의 문자열 길이는 다음과 같습니다. (length)
11. JS의 문자는 + 기호를 사용하여 문자와 연결됩니다.
12 JS의 비교 연산자는 == 같음, != 같지 않음, > ,>=,<.<=
13. JS
14에서 변수를 선언하려면 var를 사용하세요. JS의 판단 문 구조: if(condition){}else{}
15.JS 루프 구조: for( [초기식];[조건];[upadte 식]) {내부 루프}
16. 루프를 종료하는 명령은 다음과 같습니다. break
17. JS의 함수 정의: function functionName([매개변수], ...){ 문[s]}
18. 파일에 여러 양식이 나타날 경우 document.forms[0], document.forms[1]을 대신 사용할 수 있습니다.
19. 창: 창 열기(), 창을 닫습니다. : window.close(), 창 자체: self
20. 상태 표시줄 설정: window.status="character";
21. 팝업 프롬프트 메시지: window.alert("character"); 확인 상자: window.confirm();
23. 입력 프롬프트 상자 팝업: window.prompt()
24. 현재 표시된 링크의 위치 지정: window.location.href="URL"
25. 꺼내기 형식의 모든 양식 수: document.forms.length
26. 문서의 출력 스트림을 닫습니다.: document.close();
27. 문자열 추가 커넥터: +=
28. : document.createElement(), document.createTextNode()
29. 요소를 가져오는 방법: document.getElementById()
30. 양식의 모든 텍스트 멤버 값을 비어 있게 설정합니다:
var form = window.document. Forms[0]
for (var i = 0; i if (form.elements.type == "text"){
form.elements.value = "";
}
}
31. 확인 버튼이 JS에서 선택됨: document.forms[0].checkThis.checked(checked 속성은 TRUE 또는 FALSE가 반환되는지 나타냄)
32. 라디오 버튼 그룹(라디오 버튼의 이름은 동일해야 함): 라디오 버튼 그룹 document.forms[0].groupName.length
33 선택됨은 라디오 버튼 그룹이 선택되었는지 여부를 결정하는 데에도 사용됩니다.
34 드롭다운 목록 상자의 값: document.forms[0]. selectName.options[n].value(n은 선택한 값을 결정하기 위해 목록 상자 이름에 .selectedIndex 추가 드롭다운을 사용하는 경우도 있음)
35. 문자열 정의: var myString = new String("This is Lightsword");
36. 문자열을 대문자로 변환: string.toUpperCase(); 문자열을 소문자로 변환: string.toLowerCase();
37 문자열 1에서 문자열 2가 나타나는 위치를 반환합니다: String1.indexOf("String2")!=- 1은 찾을 수 없음을 의미합니다.
38. 문자열의 지정된 위치에 있는 문자 A를 가져옵니다: StringA.charAt(9);
39. 문자열의 지정된 시작 지점과 끝 지점에서 하위 문자열을 제거합니다. stringA.substring( 2,6);
40. 수학 함수: Math.PI( pi 반환), Math.SQRT2(제곱근 반환), Math.max(value1, value2)는 두 숫자 중 가장 중요한 값인 Math.pow를 반환합니다. (value1,10)은 value1의 10제곱을 반환합니다. Math.round( value1) 반올림 함수 Math.floor(Math.random()*(n+1))는 난수
41를 반환합니다. 날짜 변수 정의: var today. = new Date();
42. 날짜 함수 목록: dateObj.getTime()은 시간을 가져오고, dateObj.getYear()는 연도를 가져오고, dateObj.getFullYear()는 4자리 연도를 가져오고, dateObj.getMonth()는 월, dateObj.getDate()는 일을 가져오고, dateObj.getDay()는 날짜를 가져오고, dateObj .getHours()는 시간을 가져오고, dateObj.getMinutes()는 분을 가져오고, dateObj.getSeconds()는 초를 가져오고, dateObj.setTime은 (값)은 시간을 설정하고, dateObj.setYear(val)은 연도를 설정하고, dateObj.setMonth(val)은 월을 설정하고, dateObj.setDate(val)는 일을 설정하고, dateObj.setDay(val)는 요일을 설정합니다. dateObj.setHours는 시간을 설정하고, dateObj.setMinutes(val)는 분을 설정하고, dateObj.setSeconds(val)는 초를 설정합니다. [참고: 이 날짜와 시간은 0부터 계산 시작]
43 FRAME 표현: [window.]frames [n].ObjFuncVarName,frames["frameName"].ObjFuncVarName,frameName.ObjFuncVarName
44.parent는 상위 개체를 나타내고 top은 최상위 개체를 나타냅니다
45 하위 창을 여는 상위 창은 opener
46입니다. 현재 위치를 나타냅니다: this
47. 하이퍼링크에서 JS 함수를 호출할 때 (javascript:)를 사용하여 함수 이름을 시작하고 추가합니다
48. 이전 브라우저에서는 이 JS가 서버에서 실행되지 않습니다:
49. 파일 스타일 JS 참조:50. 스크립트를 지원하지 않는 브라우저에 표시되는 HTML을 지정합니다:
51 하이퍼링크와 ONCLICK 이벤트가 모두 있는 경우 이전 버전의 브라우저는 a.html로 리디렉션됩니다. b.html로 리디렉션됩니다. 예: dfsadf
52.JS의 내장 개체는 Array, Boolean, Date, Error, EvalError, Function, Math, Number, Object, RangeError, ReferenceError, RegExp, String, SyntaxError, URIError
53.JS 줄 바꿈: n
54. 창 전체 화면 크기:<script>function fullScreen(){ this.moveTo(0,0);this.outerWidth=screen.availWidth;this.outerHeight=screen. availHeight;}window.maximize =fullScreen;</script>
55.all은 JS 아래의 모든 요소를 ​​나타냅니다.
56.JS의 초점 순서: document.getElementByid("Form Element").tabIndex = 1
57.The innerHTML의 값은 form 요소의 값입니다. 그렇다면 innerHTML의 값은 다음과 같습니다.
58. innerTEXT의 값은 위와 동일하지만 이러한 종류의 표시가 표시되지 않습니다. contentEditable은 요소를 수정할 수 있는지 여부를 설정할 수 있으며, isContentEditable은 상태를 수정할 수 있는지 여부를 반환합니다.
60.isDisabled는 금지 상태인지 여부를 결정합니다. .addBehavior()는 JS에서 호출되는 외부 함수 파일이며 .htc
63.window.focus()의 경우 현재 창이 모든 창 앞에 표시됩니다.
64.blur()는 FOCUS()와는 달리 포커스를 잃는다는 의미입니다. ).
65.select()는 요소가 선택되었음을 의미합니다.
66. 사용자가 텍스트 상자에 텍스트를 입력하는 것을 방지합니다: onfocus="this.blur()"
67 페이지에서 이 요소가 나타나는 횟수를 가져옵니다. : document.all.tags("p (또는 기타 HTML 태그)").length
68 JS에는 두 가지 유형의 양식 출력이 있습니다: modal 및 non-modal.window.showModaldialog(), window.showModeless()
69. 상태 표시줄 텍스트 설정: window.status='text', 기본 상태 표시줄 텍스트 설정: window.defaultStatus = 'Text.';
70. 즐겨찾기에 추가: external.AddFavorite("http://www.dannyg. com","jaskdlf");
71.JS에서 발생 스크립트 오류가 발생할 때 아무것도 하지 않음: window.onerror = doNothing; 오류 핸들을 지정하는 구문은 다음과 같습니다: window.onerror = handlerError;
72. 상위 창 지정 JS에서 현재 열려 있는 창: opener.opener를 지원하는 window.opener. ..다중 연속.
73.JS의 Self는 현재 창을 나타냅니다.
74.JS의 상태 표시줄에 표시되는 콘텐츠: window.status JS의 ="content"
75.top은 프레임 세트의 최상위 수준을 나타냅니다. 프레임워크
76.JS는 현재 창을 닫습니다: window.close();
77.JS는 확인 상자를 표시합니다: if(confirm(" 정말로요?")){alert("ok");} else{alert("Not Ok");}
78.JS에서 창 리디렉션: window.navigate("http://www.sina.com. cn");
79.JS에서 인쇄: window.print()
80.JS의 프롬프트 입력 상자: window.prompt("message","defaultReply");
81.JS의 창 스크롤 막대: window.scroll (x,y)
82.JS 창은 window.scrollby

83.JS에서 시간 간격을 설정합니다: setInterval("expr",msecDelay) 또는 setInterval(funcRef,msecDelay) 또는 setTimeout
84. NN No: showModalDialog("URL"[,arguments][,features]);
85 JS에서 종료하기 전에 사용되는 핸들: function verifyClose(){event.returnValue="정말 마음에 듭니다. ";}} window.onbeforeunload=verifyClose;
86. 양식이 처음 호출될 때 사용되는 파일 핸들: onload()
87. 양식이 닫힐 때 호출되는 파일 핸들 : onunload()
88.window. 위치 속성: 프로토콜(http:),호스트 이름(www.example.com),포트(80),호스트(www.example.com:80),경로 이름("/a/a .html"),hash(" #giantGizmo", 해당 앵커로 점프하는 것을 의미함), href(모든 정보)
89.window.location.reload()는 현재 페이지를 새로 고칩니다.
90.window.history.back( ) 이전 페이지로 돌아가기, window .history.forward() 다음 페이지로 돌아가기, window.history.go (페이지로 돌아가기, 방문한 URL을 사용할 수도 있음)
91.document.write() 줄바꿈 없이 출력 , 줄바꿈이 있는 document.writeln() 출력
92.document.body.noWrap=true; 링크 텍스트가 줄 바꿈되지 않도록 합니다.
93. 변수 이름.charAt(번호), "abc. ".charCodeAt(여러 개의 숫자)는 해당 문자의 ASCII 코드 값을 반환합니다.
95. 문자열 연결: string.concat(string2) 또는 +=를 사용하여 연결합니다.
96. Variable.indexOf("문자", 시작 위치) , 첫 번째 발생 위치를 반환합니다(0부터 계산).
97.string.lastIndexOf(searchString[,startIndex]) 마지막 발생 위치
98.string.match(regExpression)는 문자가 일치하는지 여부를 결정합니다. 99. string.replace(regExpression,replaceString)은 기존 문자열을 대체합니다.
100.string.split(separator)는 값을 저장할 배열을 반환합니다.
101.string.substr(start[,length])는 문자열에서 숫자를 가져옵니다. 지정된 숫자를 지정된 문자열로 변경합니다.
102.string.toLowerCase()는 모든 문자를 소문자로 변경합니다.
104.parseInt(string[,radix(representing) base) ])는 강제로 정수형으로 변환됩니다.
105.parseFloat(string[,radix])는 강제로 부동 소수점 유형으로 변환됩니다.
106.isNaN(변수): 숫자인지 테스트합니다. type.
107.상수 정의용 키워드: const , 변수 정의용 키워드: var

有用的js程序代码:

//去左空格;
function ltrim(s){
return s.replace( /^\s*/, "");
}
//去右空格;
function rtrim(s){
return s.replace( /\s*$/, "");
}
//左右空格;
function trim(s){
return rtrim(ltrim(s));
}
//检查非法字符
//str 要检查的字符
//badwords 非法字符 &|<>=
function checkbadwords(str, badwords) {
if (typeof (str) != "string" || typeof (badwords) != "string") {
return (false);
}
for (i=0; i bad = badwords.charAt(i);
for (j=0; j if (bad == str.charAt(j)) {
return false;
break;
}
}
}
return true;
}
//检查合法字符,限制只能输入的字符
//str 要检查的字符
//goodwords 合法字符 1234567890abcdefghijklmnopqrstuvwxyz
function checkgoodwords(str, goodwords) {
if (typeof (str) != "string" || typeof (goodwords) != "string") {
return (false);
}
for (i=0; i this_str = str.charAt(i);
for (j=0; j if (this_str == goodwords.charAt(j)) {
break;
}
if(j==goodwords.length-1){
return false;
}
}
}
return true;
}
로그인 후 복사
//函 数 名:chkinteger
//功能介绍:检查是否为数字
//参数说明:要检查的字符串
//返 回 值:false:不是 true:是
function chkinteger(checkStr) {
var checkOK = "0123456789+-";
var allValid = true;
for (i=0; i ch = checkStr.charAt(i);
if (checkOK.indexOf(ch) == -1) {
allValid = false;
break;
}
if ((ch == &#39;+&#39; || ch == &#39;-&#39;) && i>0) {
allValid = false;
break;
}
}
return (allValid);
}
//函 数 名:chklength
//功能介绍:检查字符串的长度
//参数说明:要检查的字符串
//返 回 值:字节长度值
function chklength(checkStr) {
var n = 0;
for (i=0; i chcode = checkStr.charCodeAt(i);
if (chcode>=0 && chcode<=255) {
n++;
} else {
n += 2;
}
}
return (n);
}
로그인 후 복사

以上就是js入门基础编程的全部内容了,感谢大家的阅读!

위 내용은 초보자를 위한 js 구문의 기본 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿