DOM进阶

最新推荐文章于 2024-07-22 13:57:13 发布

xiexinxia

最新推荐文章于 2024-07-22 13:57:13 发布

阅读量121

点赞数

分类专栏：笔记文章标签： dom html css javascript

本文链接：https://blog.csdn.net/xieixnxia/article/details/118515767

版权

HTML属性操作（对象属性）

获取静态HTML中的属性值

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		window.onload = function(){
			var oBtn = document.getElementById("btn");
			oBtn.onclick=function(){
				alert(oBtn.id);
			}

		}
	</script>
</head>
<body>
	<input id="btn" type="button" class="myBtn" value="获取"/>

</body>
</html>

动态获取DOM中的属性值

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		window.onload=function(){
			var oInput=document.createElement("input");
			oInput.id="submit";
			oInput.type="button";
			oInput.value="提交";
			document.body.appendChild(oInput);

			oInput.onclick=function(){
				alert(oInput.id);
			};

		}
		

	</script>
</head>
<body>
	
</body>
</html>

获取文本框的值

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		window.onload=function(){
			var oBtn=document.getElementById("btn");
			oBtn.onclick=function(){
				var oTxt=document.getElementById("txt");
				alert(oTxt.value);
			}
		}
	</script>
</head>
<body>
	<input type="text" id="txt">
	<input type="button" id="btn" value="获取">
	
</body>
</html>

获取单选框的值

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		window.onload=function(){
			var oBtn=document.getElementById("btn");
			var oFruit=document.getElementsByName("fruit");
			oBtn.onclick

最低0.47元/天解锁文章

xiexinxia

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
DOM进阶

HTML属性操作（对象属性）获取静态HTML中的属性值<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> window.onload = function(){ var oBtn = document.getElementById("btn");
复制链接

扫一扫

专栏目录