014_JS中DOM对象的属性获取和操作

最新推荐文章于 2022-11-29 22:11:04 发布

五指山西

最新推荐文章于 2022-11-29 22:11:04 发布

阅读量713

点赞数 1

分类专栏： JavaScript 文章标签： js

本文链接：https://blog.csdn.net/weixin_44014460/article/details/106795771

版权

JavaScript 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

JS对html标签属性的获取和操作

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
		function GetAtribute(){
			/************第一种获取节点属性和操作属性的方法********/
			// 首先获取节点对象
			var inp = document.getElementById("inp1")
			// 获取各个属性,都是节点属性
			var typ = inp.type
			var Id = inp.id
			var va = inp.value
			var nam = inp.name
			alert(typ+'----'+Id+"-----"+va+"----"+nam)
			// 操作属性
			inp.type = "button"
			inp.value = "电视剧"
		}
		
		function GetAtribute2(){
			var inp = document.getElementById("inp1")
			// 第二种获取属性的方式
			var typ = inp.getAttribute("type") 
			var va = inp.getAttribute("value")
			alert(typ+"----"+va)
			//改变属性的方法二，第一个是属性名，第二个是要设置的值
			inp.setAttribute("value","恐怖电影")
			alert(inp.value)
		}
		</script>
	</head>
	<body>
		<input type="text" id="inp1" value="天气预报" name="uname" /><br />
		<input type="button" onclick="GetAtribute()" value="获取元素属性1" /><br />
		<input type="button" onclick="GetAtribute2()" value="获取元素属性2" />
		
		
	</body>
</html>

结果

在这里插入图片描述

五指山西

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
014_JS中DOM对象的属性获取和操作

JS对html标签属性的获取和操作<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function GetAtribute(){ /************第一种获取节点属性和操作属性的方法********/ // 首先获取节点对象 v
复制链接

扫一扫