zoukankan      html  css  js  c++  java
  • jQuery对象与DOM对象

    jQuery对象与DOM对象是不一样的

    例子:
    <p id=”ooc”></p>

    普通处理,通过标准JavaScript处理:
    <script>
    var p = document.getElementById('ooc');  //获取p标签内id为ooc的元素,给这个文本节点增加一句话,使颜色变为红色
    p.innerHTML = '学习jQuery知识';
    p.style.color = 'red';
    </script>


    jQuery的处理:
    <script>
    var $p = $('#ooc');
    $p.html('学习jQuery知识').css('color','red');
    </script>


    如何把jQuery对象转成DOM对象?

    利用数组下标的方式读取到jQuery中的DOM对象
    数组的索引是从0开始的,也就是第一个元素下标是0

    HTML代码
    <div>元素一</div>
    <div>元素二</div>
    <div>元素三</div>

    JavaScript代码
    <script>
    var $div = $('div') //jQuery对象
    var div = $div[0] //转化成DOM对象
    div.style.color = 'red' //操作dom对象的属性
    </script>


    通过jQuery自带的get()方法
    <script>
    var $div = $('div') //jQuery对象
    var div = $div.get(0) //通过get方法,转化成DOM对象
    div.style.color = 'red' //操作dom对象的属性
    </script>

    通过$(dom)方法将普通的dom对象加工成jQuery对象后调用jQuery
    JavaScript代码
    <script>
    var div = document.getElementsByTagName('div'); //dom对象
    var $div = $(div); //jQuery对象
    var $first = $div.first(); //找到第一个div元素
    $first.css('color', 'red'); //给第一个元素设置颜色
    </script>
  • 相关阅读:
    20131001国庆作业例2-10,2-11
    20131001国庆作业例2-7,2-8,2-9
    20131001国庆作业例2-4,2-5,2-6
    20131001国庆作业第二章例2-1,2-2,2-3
    20131001国庆作业第一章例1-1
    20130930C语言作业基础练习
    编程心得4
    编程心得3
    编程心得1
    714
  • 原文地址:https://www.cnblogs.com/amy-1205/p/5848780.html
Copyright © 2011-2022 走看看