一. 获取和设置元素的内容

三个方法:

  1. html()
  2. text()
  3. val()
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="libs/jquery-3.1.1.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript">
            $(function () {
                //获取得到的标签的内的文本,不包括内部的标签。但是内部标签与标签中的空格会获取到
                var text = $(".box").text();    // ele.innerText
                console.log(text);
                var html = $(".box").html();
                //标签内的所有内容,包括子标签本身   ele.innerHTML
                console.log(html);

                //上面的方法不传入参数表示只是获取,如果传入字符串表示设置
//                $(".box").text("哈哈哈");
                //设置html,如果有标签,则会解析出来
                $(".box").html("<button>点我啊</button>")
            })

            $(function () {
                $("div button").click(function () {
                  //获取一个标签的value值(如果有)
                    var inputText = $("div input").val();
                    alert(inputText);

                })
            })
        </script>

    </head>
    <body>
        <div class="box">
            <a href="http://www.yztcedu.com">点我去育知同创</a>
        </div>
        <div>
            <input type="text" name="user" id="user" value="" />
            <br />
            <button>获取输入框中的值</button>
        </div>
    </body>
</html>

二. 获取修改删除元素的属性

  1. attr() 不是布尔值的建议用这个

  2. prop() 如果属性值是布尔值的建议用这个

  3. removeAttr()

  4. removeProp()


三. 操作class属性

对样式的操作包括:获取class,设置class,追加class,删除class,切换class,判断是否有class属性

  1. 可以使用attr()prop()去直接操作class属性

  2. addClass()追加class

  3. removeClass() 移除class

  4. toggleClass 切换class

  5. hasClass 判断是否有指定的class


四. 操作css属性

css()方法, 即可以获取内部样式, 也可以获取外部样式

  1. 如果只传入一个字符串,则是获取匹配的第一元素的这个字符串表示的属性的值。css("backgroundColor")获取背景色。

  2. 如果传入的是一个数组,则可以获取匹配的第一个元素的多个属性值。

  3. 如果传入两个参数:第一个参数是一个字符串,第二个参数是字符串或者数字。则表示设置所有匹配元素的属性的值。

  4. 如果传入的是一个js对象,则表示同时设置多个css属性和值

Copyright © 李振超 2018 all right reserved,powered by Gitbook
该文件最后修订时间: 2018-10-18 03:20:27

results matching ""

    No results matching ""