>  기사  >  웹 프론트엔드  >  JavaScript 팁 적극 권장_Javascript 팁

JavaScript 팁 적극 권장_Javascript 팁

PHP中文网
PHP中文网원래의
2016-05-16 19:26:56947검색

이벤트 소스 객체
event.srcElement.tagName
event.srcElement.type
캡처 해제
event.srcElement.setCapture()
event.srcElement.releaseCapture(); 🎜>이벤트 키
event.keyCode
event.shiftKey
event.altKey
event.ctrlKey
이벤트 반환 값
event.returnValue
마우스 위치
이벤트. x
event.y
양식 활성 요소
document.activeElement
이벤트 바인딩
document.captureEvents(Event.KEYDOWN)
양식 요소 액세스
document. txt").focus();
document.all("txt").select();
양식 명령
document.execCommand
양식 COOKIE
document.cookie
메뉴 이벤트
document.oncontextmenu
요소 만들기
document.createElement("SPAN");
마우스 기반 요소 가져오기:
document.elementFromPoint(event.x,event.y).tagName =="TD
document.elementFromPoint(event.x,event.y).appendChild(ms)
양식 그림
document.images[index]
양식 이벤트 바인딩
문서를 정의합니다. onmousedown=scrollwindow;
요소
document.Form.elements[index]
객체 바인딩 이벤트
document.all.xxx.detachEvent('onclick',a)
플러그 수- ins
navigator.plugins
변수 유형 가져오기
typeof($js_libpath) == "undefine"
드롭다운 상자
Drop-down box.options[index]
Drop- down Box.options.length
객체 찾기
document.getElementsByName("r1");
document.getElementById(id)
타이머=setInterval('scrollwindow()', 지연 );
clearInterval(timer);
UNCODE 인코딩
escape(),unescape
상위 객체
obj.parentElement(dhtml)
obj.parentNode(dom)
테이블 행 교환
TableID.moveRow(2,1)
CSS 바꾸기
document.all.csss.href = "a.css";
나란히 표시
display:inline
포커스 숨기기
hidefocus=true
너비에 따라 줄바꿈
style="word-break:break-all"
자동 새로고침

간단한 이메일

빠른 위치로 이동
obj.scrollIntoView(true)
앵커

앵커
매개변수를 전달하는 웹 페이지
location.search();
편집 가능
obj.contenteditable=true
메뉴 명령 실행
obj.execCommand
2바이트 문자
/[ ^x00-xff]/
한자
/[u4e00-u9fa5]/
영어 문자열이 표 너비를 초과하면 자동으로 줄 바꿈
word-wrap: break -word; word-break: break-all ;
투명한 배경
스타일 콘텐츠 가져오기
obj.style.cssText
HTML 태그
document.documentElement.innerHTML
첫 번째 스타일 태그
document.styleSheets[0]
스타일 태그
문서의 첫 번째 스타일입니다. styleSheets[0].rules[0 ]
빈 링크를 클릭할 때 페이지가 페이지 상단으로 재설정되는 것을 방지합니다.
word
이전 웹페이지 소스
asp:
request.servervariables("HTTP_REFERER")
javascript:
document.referrer
메모리 해제
CollectGarbage();
오른쪽 클릭 비활성화
document.oncontextmenu = function() { return false;}
저장 비활성화

선택 비활성화
주소 표시줄 아이콘

favicon.ico 이름은 동일한 16*16 색상이 바람직하며 가상 디렉터리의 루트 디렉터리에 배치됩니다.
즐겨찾기 표시줄 아이콘

소스 코드 보기

입력 방법 끄기

자동으로 모두 선택
< input type=text name=text1 value="123" onfocus="this.select()">
ENTER 키를 누르면 커서를 다음 입력 상자로 이동할 수 있습니다.

텍스트 상자의 기본값

제목 개행
obj.title = "123 sdfs "
시간으로 표시되는 마이크로초를 가져옵니다.
var n1 = new Date("2004-10-10".replace(/-/g, "/")).getTime()
창 닫기
win.closed
체크박스 플랫

선택하기 content
document.selection.createRange().duplicate().text
자동 완성 기능
이 기능 켜기
창 최대화

닫기 버튼 IE 없음
window.open("aa.htm", "meizz", "fullscreen=7");
균일한 인코딩/디코딩
alert(decodeURIComponent(encodeURIComponent) ( "http://hello.com?as= hehe")))
encodeURIComponent는 ":", "/", ";" 및 "?"도 인코딩합니다.
< onmouseover="this.bgColor='#f0f0f0'" onmouseout="this.bgColor='#ffffff'">

다양한 크기

복사 code

코드는 다음과 같습니다.

s = "rn웹 페이지의 표시 영역 너비:" document.body.clientWidth

s = "rn의 표시 영역 높이 web page:" document.body .clientHeight;
s = "rn웹 페이지의 표시 영역 높이:" "document.body.offsetWeight" (가장자리 너비 포함)"; 가장자리)";
s = "rn웹 페이지 본문의 전체 텍스트 너비:" document.body.scrollWidth;
s = "rn웹 페이지 본문의 전체 텍스트 높이:" document.body.scrollHeight;
s = "rn웹페이지가 위로 스크롤되었습니다:" document.body.scrollTop;
s = "rn웹페이지가 왼쪽으로 스크롤되었습니다:" document.body.scrollLeft
s = "rn본문 webpage:" window.screenTop;
s = "rn웹페이지 텍스트의 왼쪽:" window.screenLeft;
s = "높은 화면 해상도:" window.screen.height;
s = "rn화면 해상도 비율 너비: " window.screen.width;
s = "rn화면 사용 가능한 작업 영역 높이:" window.screen.availHeight;
s = "화면 사용 가능한 작업 영역 너비:" window.screen .availWidth ;



필터 번호


코드 복사

코드는 다음과 같습니다.




// 특수 용도

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








<입력 유형=버튼 값=채널에 추가 onclick="window.external.showBrowserUI('PrivacySettings',null)">


캐싱 없음

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





정기 매칭

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


한자 일치 정규식: [u4e00-u9fa5]
2바이트 문자 일치(한자 포함): [^x00-xff]
빈 줄 일치 정규식: n[s|
HTML 태그와 일치하는 정규식: /<(.*)>.*|<(.*) />/
선행 및 후행 공백과 일치하는 정규식: (^ s *)|(s*$) (vbscript와 같은 다듬기 기능)
이메일 주소와 일치하는 정규 표현식: w ([- .]w )*@w ([-.]w )*.w ( [-.]w )*
정규식 일치 URL: http://([w-] .) [w-] (/[w- ./?%&=]*)
다음은 예입니다.
정규식을 사용하여 웹 양식에서 텍스트 상자의 입력 내용을 제한합니다.
정규식을 사용하여 중국어 입력만 제한합니다. onkeyup="value=value.replace(/[^u4E00-u9FA5 ]/g, '')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^u4E00-u9FA5]/g,''))"
1. 정규식을 사용하여 다음을 수행합니다. 전체 너비 문자만 입력하도록 제한합니다: onkeyup="value=value.replace(/[^uFF00-uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData(' text) ').replace(/[^uFF00-uFFFF]/g,''))"
2. 정규 표현식을 사용하여 숫자 입력을 제한합니다: onkeyup="value=value.replace(/[^d] / g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^d]/g,''))"
3. 정규식만 사용하세요. 숫자와 영어를 입력할 수 있습니다: onkeyup="value=value.replace(/[W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace (/ [^d]/g,''))"


이미지 도구 모음 지우기

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








자동 종료

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


function Close() 

 var ua=navigator.userAgent 
 var ie=navigator.appName=="Microsoft Internet Explorer"?true:false 
 if(ie)
 { 
      var IEversion=parseFloat(ua.substring(ua.indexOf("MSIE ") 5,ua.indexOf(";",ua.indexOf("MSIE ")))) 
  if( IEversion  { 
   var str  = '
       str  = ''; 
       document.body.insertAdjacentHTML("beforeEnd", str); 
       document.all.noTipClose.Click(); 
  } 
      else 
  { 
       window.opener =null; 
       window.close(); 
      } 
   } 
 else 
 { 
  window.close() 
   } 



取得控件得绝对位置(1)


[Ctrl A 全选 注:如需引入외부Js需刷新才能执行]


获得控件的绝对位置(2)

复代码 代码如下:


oRect = obj.getBoundingClientRect( ); 
oRect.왼쪽 
oRect. 


光标停在文字最后


[Ctrl A 全选 注:如需引入외부Js需刷新才能执行]



//페이지 진입 및 종료에 대한 특수 효과

페이지 진입
페이지 종료
로드 중인 페이지입니다. 입장 및 호출 시 일부 특수 효과. 지속 시간은 특수 효과의 지속 시간을 초 단위로 나타냅니다. 전환은 사용할 특수 효과를 나타냅니다.
값은 1-23입니다.
0 직사각형 축소 위에서 아래로 새로 고침
5 위에서 아래로 새로 고침
6 왼쪽에서 오른쪽으로 새로 고침
7 오른쪽에서 왼쪽으로 새로 고침
8개의 수직 블라인드
9개의 수평 블라인드
10개의 잘못 정렬된 수평 블라인드
11개의 잘못 정렬된 수직 블라인드
12포인트 스프레드
13개의 왼쪽 및 오른쪽에서 가운데 ​​새로 고침
14 중간에서 왼쪽 및 오른쪽 새로 고침
15 중간에서 위쪽 및 아래쪽
16 위쪽 및 아래쪽에서 중간
17 오른쪽 아래쪽에서 왼쪽 위쪽
18 오른쪽 위쪽에서 왼쪽 아래쪽
19 왼쪽 위쪽 오른쪽 아래
20 왼쪽 아래 오른쪽 위
21 가로 막대 ;meta name="ROBOTS" content="속성 값"> 속성 값에는 다음이 포함됩니다.
속성 값이 "all"이면 파일이 검색되고 페이지의 링크가 쿼리될 수 있습니다.
속성 값이 "none"이면 파일이 검색되지 않으며 페이지의 링크가 쿼리되지 않습니다.
속성 값이 "index": 파일이 검색됩니다.
속성 값이 "follow"입니다. 링크가 쿼리됩니다.
속성 값이 "noindex"입니다. 검색되지 않지만 링크를 쿼리할 수 있습니다.
속성 값은 "nofollow"입니다.



//페이지 매김 인쇄


page1


page2



//인쇄 설정