자바스크립트 기본 튜토리얼: DOM 및 HTML

html 내용 변경

innerHTML

아래에 작성해 보겠습니다. 예를 들어 코드는 다음과 같습니다.

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>	
</head>
<body>
	<div name="test" class="dv" id="dv">php 中文网</div>

	<script type="text/javascript">
		var div = document.getElementById("dv");
		var test = div.innerHTML = "php.cn";
		alert(test);
	</script>
</body>
</html>

위 코드와 마찬가지로 먼저 id를 통해 요소 노드를 가져온 다음 값을 변경하여 변수에 할당합니다. 테스트 후 출력

html 속성을 변경하면 코드는 다음과 같습니다

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>	
</head>
<body>
	<img src="https://img.php.cn/upload/course/000/000/010/582eab68f0bdb633.jpg" name="image" id="image"
	width="50" height="50">

	<script type="text/javascript">
	        //注释这段代码，看一下，是一张图，运行之后，显示的不是原图，是另外一张图
		document.getElementById("image").src="https://img.php.cn/upload/course/000/000/010/582eab9aa05cd314.jpg";
	</script>
</body>
</html>

지속적인 학습

새로운 파일

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div name="test" class="dv" id="dv">php 中文网</div> <script type="text/javascript"> var div = document.getElementById("dv"); var test = div.innerHTML = "php.cn"; alert(test); </script> </body> </html>

제출하다 코드 재설정

자동운전