获取元素

2016-06-04  本文已影响0人  行动改变一切

html代码示例:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>查找元素</title>
    </head>
    <body>
        <ol id="list">
            <li class="book">蜜蜂书店</li>
            <li class="book">模范书局</li>
            <li class="book2">物外书店</li>
            <li class="book2">库布里克</li>
        </ol>

        <p>三联韬奋</p>
        <p>字里行间</p>
        <p class="page">言几又</p>

        <input type="button" value="按钮1" name="btn" />
        <input type="button" value="按钮2" name="btn" />
        <input type="button" value="按钮3" class="btn" />

    </body>
</html>

javascript获取元素

  1. 通过id获取元素
var list = document.getElementById("list");
  1. 通过TagName获取元素
var pages = document.getElementsByTagName("p");
  1. 通过ClassName获取元素 //IE9以下不支持
var books1 = document.getElementsByClassName("book");

4.通过Name获取元素 //IE下不是所有标签都支持此获取方法

var btn1 = document.getElementsByName("btn");

5.通过querySelector获取元素 //IE9以下不支持

var btn2 = document.querySelector(".btn");

6.通过querySelectorAll获取元素 IE9以下不支持

var books2 = document.querySelectorAll("#list .book2");
//返回元素数组,需通过下标操作单独元素,通过循环遍历每一个元素,

7.自调用函数

(function (a,b) {
console.log(a,b);
})(10,20);
上一篇 下一篇

猜你喜欢

热点阅读