<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>DOM对象'&&'jQuery对象对比</title>

    <script src="../jQuery库/jquery-3.3.1.js"></script>

    <script>

        // DOM对象给元素div   ID="hello"加一段文字,再将字体改为红色

        window.onload = function(){

            //获取id为imooc1的元素div

            var a = document.getElementById("hello");

            //改变div元素中的值

            a.innerHTML="这是最佳途径";

            //改变样式

            a.style.color="red";

        }

        //用jQuery对象给元素div  ID="world"加一段文字,再将字体改为粉色

        $(document).ready(function(){

            //通过jQuery语法获取id为imooc2的元素获得一个jQuery对象

            var $a = $("#world");

            //调用该对象的html()方法进行更改内容,调用该对象的css()方法进行更改颜色,字体样式

            $a.html("这是好的开始!").css({

                color: "pink",

                fontSize: "50px"

            });

        });

    </script>

</head>

<body>

    <div id="hello"></div>

    <div id="world"></div>

</body>

</html>

这段代码会有助于区别两种对象,代码中有详细的解释!!!

JavaScript的DOM对象和jQuery对象的对比的更多相关文章

  1. JavaScript 对象、DOM对象、jquery对象的区别、转换详解

    一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...

  2. JavaScript DOM对象和JQuery对象相互转换

    1.分析源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...

  3. JQuery $ $.extend(),$.fn和$.fn.extend javaScript对象、DOM对象和jQuery对象及转换 工具方法(utility)

    一.为什么jquery前面要写$ Javascript没有package的概念,而作者又希望所有jQuery相关的API都能通过一个全局性的对象来容纳. 名为jQuery的全局变量就是这样一个对象,不 ...

  4. 关于DOM对象与JQuery对象的那些事

    这个问题源自上一次的工作室讨论班,主题是"jQuery选择器的使用",在讨论班的结尾,我留了一个思考题:  jQuery获取到的对象和直接调用原生Javascript方法获得的对象 ...

  5. jQuery介绍 DOM对象和jQuery对象的转换与区别

    jQuery介绍 DOM对象和jQuery对象的转换与区别 jQuery介绍      jQuery: http://jquery.com/      write less, do more.   j ...

  6. DOM对象与jquery对象有什么不同

    jQuery对象和DOM对象使用说明,需要的朋友可以参考下.1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQuery ...

  7. DOM对象与JQUERY对象的相互转化

    普通处理,通过标准JavaScript处理: 1 var p = document.getElementById('imooc') 2 p.innerHTML = '您好!学习jQuery才是最佳的途 ...

  8. DOM对象与jquery对象的区别

    jQuery对象和DOM对象使用说明,需要的朋友可以参考下. 1.jQuery对象和DOM对象 第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DOM对象,因此需要重点了解jQue ...

  9. DOM对象和JQuery对象

    1.JS对象转化为Jquery对象 Var p=document.getElementById(“p”); Var $obj=$(p); 2.Jquery对象转换为JS对象 Var $bh=$(“#i ...

  10. DOM对象和JQuery对象的区别

    DOM对象和JQuery对象的区别 jQuery对象和DOM对象使用说明,需要的朋友可以参考下.1.jQuery对象和DOM对象第一次学习jQuery,经常分辨不清哪些是jQuery对象,哪些是 DO ...

随机推荐

  1. 用Java实现简单的区块链

    用 Java 实现简单的区块链 1. 概述 本文中,我们将学习区块链技术的基本概念.也将根据概念使用 Java 来实现一个基本的应用程序. 进一步,我们将讨论一些先进的概念以及该技术的实际应用. 2. ...

  2. python_day2(列表，元组，字典，字符串)

    1.bytes数据类型 msg = '我爱北京天安门' print(msg.encode(encoding="utf-8")) print(msg.encode(encoding= ...

  3. phpstorm设置内存限制的方法

    phpstorm设置内存限制的方法有时候用phpstorm写代码 1个文件代码多的话会很卡 那就要修改内存限制 E:\Program Files (x86)\JetBrains\PhpStorm 20 ...

  4. Linux命令实战（五）

    1.显示/etc目录下,以非字母开头,后面跟了一个字母以及其他任意长度字符的文件或目录. [qiuhom@test ~]$ls -d /etc/[^[:alpha:]][[:alpha:]]* ls: ...

  5. js数组方法大全（下）

    # js数组方法大全(下) 记录一下整理的js数组方法,免得每次要找方法都找不到.图片有点多,注意流量,嘻嘻! 本期分享 forEach() map() filer() every() some() ...

  6. 看淡生死，不服就干（C语言指针）

    看淡生死,不服就干 emmmmm 其实今天蛮烦的 高等数学考的一塌糊涂 会的不会的都没写 真心没有高中轻松了啊 也不知道自己立的flag还能不能实现 既然选择了就一定坚持下去啊 下面还是放一段之前写的 ...

  7. 为React绑定事件，并修改state中的值

    import React from 'react' export default class ClickS extends React.Component { constructor () { sup ...

  8. 搭建wordPress遇到无法连接数据库的问题

    在确认了数据库用户,密码,地址都没有错的情况下,仍然出现无法连接数据库的问题,以至无法安装wordpress 我的wordpress:4.8.1-zh_CN 解决办法: 1.更改php的版本(我的改为 ...

  9. PostGIS 结合Openlayers以及Geoserver实现最短路径分析（一）

    环境: Win10 ArcMap10.4(用于数据处理) postgresql9.4 postgis2.2.3 pgRouting2.3(postgresql插件) ##附上本文配套素材下载地址:ht ...

  10. 20191010-5 alpha week 1/2 Scrum立会报告+燃尽图 03

    此作业要求参见[https://edu.cnblogs.com/campus/nenu/2019fall/homework/8748] 一.小组情况 队名:扛把子 组长:迟俊文 组员:宋晓丽 梁梦瑶 ...