
思路:用getElementsByTagName方法来实现。
片断代码如下:
<html><head>
<script type="text/javascript">
function getElements()
{
var x=documentgetElementsByTagName("input");
alert(xlength);
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()" value="How many input elements" />
</body>
</html>
效果图如下:
定义和用法
getElementsByTagName() 方法可返回带有指定标签名的对象的集合。
这要分两种情况:
1、按钮在div中。
我们可以通过:
var btn = documentgetElementById("btn");//获取按钮节点
var div = btnparentNode;//获取di元素,当然不一定div就是按钮的父元素,可以通过parentNode向上查找,最好还是给div加一个id2、按钮不在div中
我们可以通过:
//以上这种情况最好给div加一个id,通过以下方式获得
var div = documentgetElementById("div")
//如果不想加的话,以下方式
var divs = documentgetElementsByTagName("DIV");
var div = divsitem(n);//n表示要取的div,从0开始
<body style="height: 2000px;">
<div class="c f" onclick="fn()" style="border:10px solid #ccc;height: 80px;color:red;background:rebeccapurple"> 我是div</div>
<script>
let div = documentquerySelector('div');
/ 通过style在行内样式上获取样式 /
/ 使用style获取样式 写的什么 就能获取到什么
不会转成rgb 和 出现其他的样式 /
consolelog('style',divstylecolor )
consolelog('style',divstylebackground )
/ style是获取不到在内部样式上或者外部样式上的样式的 /
// consolelog( divstylecolor )
// / font-size js中要是用驼峰的方式获取 /
// consolelog( divstylefontSize )
/ 使用windowgetComputedStyle可以获取行内、内部、外部的所有样式
但是 获得color是rbg格式的,获取的background是所有属性 /
consolelog( windowgetComputedStyle(div,null)color )
consolelog( windowgetComputedStyle(div,null)fontSize )
consolelog( windowgetComputedStyle(div,null)background )
consolelog( windowgetComputedStyle(div,null)height )
// documentonscroll = function (){
// consolelog(documentdocumentElementscrollTop);
// }
</script>
以上就是关于js如何获取页面 元素全部的内容,包括:js如何获取页面 元素、JavaScript如何获取按钮所在的div元素、js之获取元素样式等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)