자바스크립트 기본활용법
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<p id="demo"><b>여기가 p태그입니다</b> </p>
<!--
JavaScript != Java
client(웹브라우저, 화면단) -> front end
목적: tag들을 접근하기 위한 스크립트 Node.js -> react, vue
컴파일을 하지 않는다
Java Script 경량화 -> Jquery(Ajax) -> axios
예) 회원가입 시 -> 빈칸인가 조사, ID글자 조사, PW조사
다양한 애니메이션도 구성이 가능하다
class(JAVA)
attribute(속성)
property(특성)
element(요소)
id -> javascript 1개
class -> CSS 다수
name -> 데이터 전송 다수
in-line-> tag안
internal-> head
external-> 외부파일
-->
<script type="text/javascript">
console.log("hell");
var v = document.getElementById("demo").innerHTML ;
//alert(v);
document.getElementById("demo").innerHTML = "P tag";
var obj= document.getElementById("demo");
window.alert(obj.innerHTML);
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<script type="text/javascript">
/*
*
Integer, double, String, Character, boolean, Object, Array
var let
MyClass cls = new MyClass();
객체, object
instance(== 주체)
*/
let cars = new Array(3);
cars[0] = "ssab";
cars[1] = "volvo";
cars[2] = "bmw";
for( i=0; i<cars.length; i++){
console.log(cars[i]);
}
for(i in cars){
console.log(cars[i]);
}
// json(=데이터) (key:value) pair
let obj ={
firstname: "길동",
lastname : "홍",
age:24,
func:function(){
console.log("func()함수 호출");
}
};
console.log(obj.firstname);
console.log(obj.age);
obj.func();
class Person{
constructor(name, age){
this.name = name;
this.age =age;
}
funcName(){
console.log("Person funcName()")
}
}
let p = new Person("홍길동", 24)
console.log(p.name);
console.log(p.age);
p.funcName();
</script>
</body>
</html>