DOM获取元素

最新推荐文章于 2024-07-08 22:48:46 发布

weixin_44740410

最新推荐文章于 2024-07-08 22:48:46 发布

阅读量143

点赞数

本文链接：https://blog.csdn.net/weixin_44740410/article/details/88857830

版权

根据id获取元素,返回一个元素对象
getElementById("id名")

根据标签名获取元素,返回一个伪数组,数组里存的是多个DOM元素对象
getElementsByTagName

下面的可能有些浏览器不支持
根据name属性获取元素,返回一个伪数组,数组里存的是多个DOM元素对象
getElementsByName("name属性值")
根据class类名获取元素,返回一个伪数组,数组里存的是多个DOM元素对象
getElementsByClassName("类名")
根据选择器获取元素,返回一个元素对象
querSelector("选择器的名字");
根据择器获取元素,,返回一个伪数组,数组里存的是多个DOM元素对象
querSelectorAll("选择器的名字");

</textarea>
<input type="button" value="注册" id="btn" >
<script>
// checked selected readonly:可读(在js代码中式驼峰命名) disabled：禁用标签
//点击按钮，修改文本域的可读状态
document.getElementById("btn").onclick = function () {
var txtarea = document.getElementsByTagName("textarea")[0];
console.log(txtarea);
txtarea.readOnly=false;
//获取文本域的文本内容 --innerText
// txtarea.innerText="哈哈！";
txtarea.value="嘎嘎！";//推荐用value，因为把textarea看成表单元素操作

// this.disabled="disabled";
// alert("被点了")
}

</script>

<input type="button" value="修改" id="btn">
<div id="dv" style="width:100%;height:400px; background-color:red">
这是div标签
</div>

</script>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" value="显示效果" id="btn"><br>

// 点击按钮，修改3,4,5的文本框的值
my$("btn").onclick = function () {
//getElementsByName:通过name属性获取元素，返回一个伪数组
var inputs = document.getElementsByName("change");
for(var i=0;i<inputs.length;i++){
inputs[i].value="要下雨了";
}
}

</script>

</body>
</html>