首页 > Web开发 > 详细

潭州课堂25班:Ph201805201 WEB 之 Ajax第八课 (课堂笔记)

时间:2018-08-10 10:33:15      阅读:184      评论:0      收藏:0      [点我收藏+]

js 《——》jq

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div>一</div>
    <div>二</div>
    <div>三</div>

    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script>

        // JQ --> JS
        var $div = $(‘div‘);            //JQ 对象
        var div0 = $(‘div‘)[0];         // JS 对象
        var div1 = $(‘div‘).get(1);     // JS 对象

        // js --> jq
        var div = document.getElementsByTagName(‘div‘);
        var $divs = $(div);
    </script>
</body>
</html>

  

this 特殊选择器

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
    <!--<style>-->
        <!--div{-->
            <!--color: ;-->
        <!--}-->
    <!--</style>-->
<body>
    <div>一二三四</div>

    
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script>
        $(‘div‘).click(function () {
            var $div = $(this);
            $div.css(‘color‘,‘yellow‘)      // 特殊选择器指的是当前元素
        })
    </script>
</body>
</html>

  

 

each 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <ul>
        <li>1aa</li>
        <li>2bb</li>
        <li>3cc</li>
        <li>4dd</li>
    </ul>

    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <script>

        // JQ 里的 each 方法
        // $.each([‘a‘,‘b‘,‘c‘],function(i,n){
        //     console.log(i+‘:‘+n);            //类似 for 循环
        // });

        var $ul = $(‘li‘);
        $.each($ul,function (i,li) {
            console.log($(li).text());         //  JQ 依次拿到 li 中的文字
            console.log(li.innerText);         //  JS 依次拿到 li 中的文字
        })

        $.each($ul,function () {
            console.log($(this).text());         //  JQ 依次拿到 li 中的文字
            console.log(this.innerText);         //  JS 依次拿到 li 中的文字
        })
        
    </script>
</body>
</html>

  

Ajax

 

潭州课堂25班:Ph201805201 WEB 之 Ajax第八课 (课堂笔记)

原文:https://www.cnblogs.com/gdwz922/p/9452777.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!