<!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. 应用 Valgrind 发现 Linux 程序的内存问题及交叉编译for arm

    Valgrind 概述 体系结构 Valgrind是一套Linux下,开放源代码(GPL V2)的仿真调试工具的集合.Valgrind由内核(core)以及基于内核的其他调试工具组成.内核类似于一个框 ...

  2. 关于DP与背包

    听说过动态规划(DP)的同学应该都知道有背包问题的存在. 首先我们来了解一下动态规划 基本思想: 动态规划算法通常用于求解具有某种最优性质的问题.在这类问题中, 可能会有很多可行解.没一个解都对应于一 ...

  3. .NET Framework基础知识（二）(转载)

    1.课外:为什么object数组可以赋值给object类型,int数组却不能赋值给int类型? 答:因为不管是什么什么数组都继承自Array,而Array又继承自object. 2.线程:是操作系统分 ...

  4. 基于 Android NDK 的学习之旅-----HelloWorld

    Hello World作为所有编程语言的起始阶段,占据着无法改变的地位,所有中/英/法/德/美……版本的编程教材中,hello world总是作为第一个TEST记录于书本之中,所有的编程第一步就在于此 ...

  5. SpringSecurity3.2.5自己定义角色及权限的教程

    近期阴差阳错的搞上了SpringSecurity3.由于是自己做的小系统.中间遇到了非常多坑,基本每一个坑都踩过了,网上也查了不少资料,发现有不少错误的.更是让我绕了一圈又一圈,如今把一些主要的东西总 ...

  6. 将asp.net core2.0项目部署在IIS上运行

    原文:将asp.net core2.0项目部署在IIS上运行 前言:  与ASP.NET时代不同,ASP.NET Core不再是由IIS工作进程(w3wp.exe)托管,而是独立运行的.它独立运行在控 ...

  7. 前端切图：一个好看的表格css样式

    <!DOCTYPE html><html>        <head>        <meta charset="UTF-8">  ...

  8. [Ramda] Create an Array From a Seed Value with Ramda's unfold

    In this lesson we'll look at how you can use Ramda's unfold function to generate a list of values ba ...

  9. Erlang 杂记

    学习Erlang的时候在书的留白处随手记录了一些东西,还有一些记录在了demo的注释里面,今天抽时间整理出来了一部分,分享一下. Erlang的设计哲学是为每一个独立的事件创建一个新进程. Erlan ...

  10. NOIP 模拟 box - 费用流 / 匈牙利

    题目大意: 给出n(\(\le 200\))个盒子,第i个盒子长\(x_i\),宽\(y_i\),一个盒子可以放入长宽都大于等于它的盒子里,并且每个盒子里只能放入一个盒子(可以嵌套),嵌套的盒子的占地 ...