Js中获取节点对象

最新推荐文章于 2023-03-20 10:49:57 发布

xiaokangmiclong

最新推荐文章于 2023-03-20 10:49:57 发布

阅读量4.5k

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/xiaokangmiclong/article/details/50476204

版权

JS 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

document.getElementsById('element'):可获取指定id对象集合,例如id为element的input标签对象。

document.getElementsByName("element"):可获取带有指定名称的对象的集合，例如name为element的input标签对象。

document.getElementsByTagName("Input"):可获取带有指定标签名的对象集合,例如input标签对象。

.parentNode表示获取其父节点对象,.childNodes表示获取其子节点对象。

var Element = document.getElementById("ul1").getElementsByTagName("li");//获取ul1的所有子元素，返回的是一个集合。
var Element = document.getElementById("ul1").childNodes;

获取与设置(添加)对象的属性：

<html>
<head>
<meta charset=" utf-8">
<script type="text/javascript">
function Attribute(){
var thisinput=document.getElementById("input");
thisinput.setAttribute("value","文本框已经改变");
// thisinput.value="文本框已经改变";
}
function get1(){
var thisinput=document.getElementById("input");
alert(thisinput.getAttribute("id"));
// alert(thisinput.id);
}
function get2(){

var thisinput=document.getElementById("input");
alert(thisinput.id.substr(2, 3));//start,length,输出put。
alert(thisinput.id.substring(3,2));//start,end.也可为substring(3，2)，从小到大开始计算并且不包含end，所以该例输出为”p“。

}
</script>
</head>
<body>
<input id="input" type="text" οnfοcus="Attribute()"/>
<button οnclick="get1()">获取input的id属性</button>
<button οnclick="get2()">截取input的id属性</button>
</body>
</html>