js 의 BOM 대상 과 DOM 대상
6867 단어 파 이 썬 기반
var d = {'a':'aa','b':18};
:
var d_json = JSON.stringify(d); //python json.dumps(d);
:
d_json = "{"a":"aa","b":18}"
var reverse_json = JSON.parse(d_json); //python json.loads()
5 、 BOM 대상
브 라 우 저 대상 모델, 브 라 우 저 와 상호작용 하 는 방법 과 인 터 페 이 스 를 설명 합 니 다.
(1) 팝 업 창
alert();confirm ();
(2) window 대상, 전역 BOM 대상, 뒤에 배 운 모든 대상 의 원본 대상
(3) location 개체
location.href;
location.href = 'http://www.baidu.com';
location.reload();
(4) 타이머
:
:var t = setTimeout(function(){confirm(' 18 ?')},5000);
var t = setTimeout("console.log('xxx')",1000);
t
:clearTimeout(t)
:
:var t = setInterval(function(){confirm(' !!')},3000);
:clearInterval(t);
6. DOM 대상
웹 페이지 내용 을 처리 하 는 방법 과 인 터 페 이 스 를 설명 합 니 다.
(1) 선택 기 직접 찾기
태그 서명 으로 찾기: var divEle = document. getElementsByTagName ('div');id 값 으로 찾기: var d1 = document. getElement ById ('d1');클래스 값 으로 찾기: var a = document. getElementsByClassName ('c1');
html :
css : .c1{ background-color: green; height: 100px; width: 100px; } .c2{ background-color: red; /*height: 100px;*/ /*width: 100px;*/ color:red; } var d2 = document.getElementsByClassName('c1'); d2.style.color = 'green'; : , , d2 , VM1527:1 Uncaught TypeError: Cannot set property 'color' of undefined at
:1:16 for (var i in d2){console.log(d2[i])}; , VM1658:1 div1 VM1658:1div2 VM1658:1 2 VM1658:1 ƒ item() { [native code] } VM1658:1 ƒ namedItem() { [native code] } for (var i=0;i
(2)间接查找选择器:
.nextElementSibling.style.color = 'red'; ,
:.previousElementSibling;
:.firstElementChild;
:.lastElementChild;
, :.children;
:.parentElement;
(3) 텍스트 작업
innerText
:
var a = document.getElementById('jd')
a.innerText;
:
a.innerText = '학교의 꽃'; ,
innerHTML
var d = document.getElementsByClassName('c1')[0];
d.innerHTML;
:
d2.innerHTML = '학교의 꽃'; ,
(4) value 값 조작
input
html:
:
var inp = document.getElementById('username');
inp.value;
inp.value = '200 !';
(5) class 클래스 값 조작
var div1 = document.getElementById('d1');
div1.classList; //
div1.classList.add('c2'); //
div1.classList.remove('c3'); //
div1.classList.toggle('c3'); // ,
var t = setInterval("div1.classList.toggle('c3')",1000); //
(6) 스타일 스타일
var div1 = document.getElementById('d1');
div1.style.color = 'green';
// css - , -,
div1.style.backgroundColor = 'green';
(7) label 보충 과 button 보충
label:id name , input
button:
,
form
:
(8) 날짜 대상
var timer = new Date(); //
timer.toLocaleString(); //
, :
// 1:
var d1 = new Date(); //
console.log(d1.toLocaleString()); //
// 2:
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString());
var d3 = new Date("04/03/20 11:12"); # / / ( 04/03/2020)
console.log(d3.toLocaleString());
// 3: ,
var d3 = new Date(5000);
console.log(d3.toLocaleString());
console.log(d3.toUTCString());
// 4:
var d4 = new Date(2004,2,20,11,12,0,300);
console.log(d4.toLocaleString()); //
var d = new Date();
//getDate()
//getDay () , (0-6), 0
//getMonth () (0-11,0 1 , )
//getFullYear ()
//getHours ()
//getMinutes ()
//getSeconds ()
//getMilliseconds ()
//getTime () ( 1970/1/1 ),
(9) 이벤트
DOM 에 서 는 탭 에 이 벤트 를 설정 할 수 있 습 니 다. 지정 한 탭 바 인 딩 이벤트 가 발생 하면 해당 하 는 코드 를 실행 합 니 다.
흔 한 사건
onclick
, 클릭 시 이벤트 촉발 ondblclick
, 더 블 클릭 촉발 사건 onchange
, 내용 수정 시 트리거 이벤트 onfocus
, 초점 획득 시 이벤트 촉발 onblur
, 초점 상실 촉발 사건 change
DOM
function changeEvent(self) {
console.log(self.value);
}
이벤트 바 인 딩 의 두 가지 방식
1
function doFavor(self) {
...
}
2
var dEle = document.getElementsByClassName('favor')
dEle.onclick = function(){
...
}
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
N - Gram 모델 로 데이터 요약 (Python 설명)자연 언어 에는 n - gram 이라는 모델 이 있 는데 문자 나 언어 중의 n 개의 연속 적 인 단어 구성 서열 을 나타 낸다.자연 언어 분석 을 할 때 n - gram 을 사용 하거나 상용 어 구 를 찾 으 면 ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.