JS获取节点

最新推荐文章于 2022-05-01 08:41:43 发布

王湘佰BLOG

最新推荐文章于 2022-05-01 08:41:43 发布

阅读量242

点赞数

分类专栏： JS HTML 笔记文章标签： dom js html5

本文链接：https://blog.csdn.net/WXB_gege/article/details/105508193

版权

笔记同时被 3 个专栏收录

25 篇文章 0 订阅

订阅专栏

14 篇文章 0 订阅

订阅专栏

HTML

3 篇文章 0 订阅

订阅专栏

JS获取节点
JS的document内置对象
把html中的每个标签看成一个节点，通过JS将这些节点获取出来
使用JS的document内置对象（对象有自己的属性和方法）
内置对象就是已经创建好的对象，我们直接使用即可。
方法：
document.getElementById(“id属性”)
根据元素的id值获取对象，返回值是一个对象
innerHTML
获取节点对象下的所有html代码。
Demo:根据id值获取元素节点对象
HTML

<body>
        <div id = "div1">
            <p>
                马上就复工了!
            </p>
        </div>
</body>

<script type="text/javascript">
	var node = document.getElementById("div1");
	console.log(node.innerHTML);
</script>

Demo:根据标签名获取元素节点

HTMl

<body>
    用户名: <input type="text" name="username" value="小爱">
     密 码 : <input type="password" name="pwd" value="1234">
     电 话 : <input type="text" name="iphone" value="110">
</body>

<script type="text/javascript">
	var inputs = document.getElementsByTagName("input");
	console.log("用户名: " + inputs[0].value);
	console.log(" 密 码: " + inputs[1].value);
	var iphone = inputs[2].value;
	//判断一个字符串是否是纯数字
	if (isNaN(iphone)){ //不是纯数字返回true, 是纯数字返回false
	    alert("电话不是纯数字")
	}else{
	    alert("电话是纯数字")
	}
</script>

Demo:根据class获取元素节点
HTML

<body>
        <p class="wuyi">
            <h1>五一快乐</h1>
        </p>
        
</body>

<script type="text/javascript">
	var ps=document.getElementsByClassName('wuyi');
	    console.log(ps);
	
</script>

王湘佰BLOG

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS获取节点

JS获取节点JS的document内置对象把html中的每个标签看成一个节点，通过JS将这些节点获取出来使用JS的document内置对象（对象有自己的属性和方法）内置对象就是已经创建好的对象，我们直接使用即可。方法：document.getElementById(“id属性”)根据元素的id值获取对象，返回值是一个对象innerHTML获取节点对象下的所有html代码。Dem...
复制链接

扫一扫

专栏目录