<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
<meta charset="utf-8" />
    <script src="jquery-3.3.1.js"></script>
    <script>
        $(function () {
            document.getElementById('btn').onclick = function () {

                $('#dv').css('width', '300px').css('height', '300px').css('backgroundColor', 'yellow');
                

                //var dvObj = document.getElementById('dv');
                //var jq = $(dvObj);

                //jquery对象转dom对象
                //var dd = jq.get(0);
                //var dd = jq[0];

                //dom写法
                //dvObj.style.width = '300px';
                //dvObj.style.height = '300px';
                //dvObj.style.backgroundColor = 'yellow';

                //jquery写法-
                //$(dvObj).css('width', '300px');
                //$(dvObj).css('height', '300px');
                //$(dvObj).css('backgroundColor', 'yellow');
                //$(dvObj).text('<font color="red" size="7">hahhahah</font>')

                //jquery写法二
                //
                //$(dvObj).css('width', '300px').css('height', '300px').css('backgroundColor', 'yellow')
                //    .text('<font color="red",size="7">hahhahah</font>')

            };
        });
    </script>
</head>
<body>
    <input type="button" name="name" value="display" id="btn" />
    <div id="dv"></div>
</body>

</html>

dom写法和jquery写法的更多相关文章

  1. js 多个事件的绑定及移除(包括原生写法和 jquery 写法)

    需要打开控制台查看效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  2. JQ写法和js写法 方法函数化

    <script> $(function () { $('#head').click=function () { alert($(this).html()) } }) </script ...

  3. Golang学习---test写法和benchmark写法

    一.Test 1. 每一个test文件须import一个testing 2. test文件下的每一个test case 均必须用Test开头并且符合TestXxxx形式,否则go test会直接跳过测 ...

  4. ASP.NET MVC深入浅出（被替换） 第一节: 结合EF的本地缓存属性来介绍【EF增删改操作】的几种形式 第三节: EF调用普通SQL语句的两类封装（ExecuteSqlCommand和SqlQuery ) 第四节: EF调用存储过程的通用写法和DBFirst模式子类调用的特有写法 第六节: EF高级属性(二) 之延迟加载、立即加载、显示加载(含导航属性) 第十节: EF的三种追踪

    ASP.NET MVC深入浅出(被替换)   一. 谈情怀-ASP.NET体系 从事.Net开发以来,最先接触的Web开发框架是Asp.Net WebForm,该框架高度封装,为了隐藏Http的无状态 ...

  5. JS对象与Dom对象与jQuery对象之间的区别

    前言 通过问题看本质: 举例: js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的 $("#save&qu ...

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

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

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

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

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

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

  9. jQuery.extend()方法和jQuery.fn.extend()方法

    jQuery.extend()方法和jQuery.fn.extend()方法源码分析 这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例, ...

随机推荐

  1. iOS开发Block的介绍以及Block的循环引用问题

    1:block的循环引用问题最主要记住两点: 如果[block内部]使用[外部声明的强引用]访问[对象A], 那么[block内部]会自动产生一个[强引用]指向[对象A] 如果[block内部]使用[ ...

  2. php课程 4-17 数组键值操作函数有哪些

    php课程 4-17  数组键值操作函数有哪些 一.总结 一句话总结:多看学习视频 1.php中数组的键值操作函数有哪6个? • array_values();获取数组中的值• array_keys( ...

  3. Jquery前端分页插件pagination使用

    插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...

  4. Git 常用命令总结（精问）

    Git 常用命令总结(精问) 一.总结 一句话总结:下次尝试做任何git的操作之前,把这个精看精问一遍,绝对会有意向不到的收获. 二.Git 常用命令总结 1.git常用命令 安装及配置: Ubunt ...

  5. [转至云风的博客]谈谈陌陌争霸在数据库方面踩过的坑( Redis 篇)

    « 谈谈陌陌争霸在数据库方面踩过的坑(芒果篇) | 返回首页 | linode 广告时间 » 谈谈陌陌争霸在数据库方面踩过的坑( Redis 篇) 注:陌陌争霸的数据库部分我没有参与具体设计,只是参与 ...

  6. Newtonsoft.Json 序列化反序列化

    public class People { public string name { get; set; } public string age { get; set; } public string ...

  7. 对raid几个技术的简单理解

    磁盘阵列(Redundant Arrays of Independent Disks,RAID),有“独立磁盘构成的具有冗余能力的阵列”之意,主要体现在两方面: 1.HA 高可用性,也就是冗余 2.L ...

  8. 建立一个OTP应用

    http://www.javaeye.com/topic/374167 以下是在erlang项目开发中的一些记录,即包含很多通俗易懂的原则,也包含一些似是而非的建议,比较混乱,还没有积累到一个可以分门 ...

  9. hdu1693插头dp(多回路)

    题意:在n*m的矩阵中,有些格子有树,没有树的格子不能到达,找一条或多条回路,吃全然部的树,求有多少中方法. 这题是插头dp,刚刚学习,不是非常熟悉,研究了好几天才明确插头dp的方法,他们老是讲一些什 ...

  10. Visual Studio 2017 and Apache Cordova mobile apps | Andrés Zsögön

    原文:Visual Studio 2017 and Apache Cordova mobile apps | Andrés Zsögön 以下是使用Microsoft Visual Studio 20 ...