JQuery笔记(一)jq的使用方法
我用的jq版本是支持pc版为主的最高1版本里最高的1.124版本
官网的链接是只有最新的3下载,我把我在官网下载的jq代码链接发出来,如下
和js不同的是,jq开发者封装了一些方法
在js获取元素节点的方式是这样的:
document.getElementById("#div");
而在jq中的方式是这样的:
$("div")[0]
在js获取对象的方式是这样的:
document.getElementsByTagName("#div");
而在jq中的方式是这样的:
$("div")
下面我具体举个例子
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
</style>
</head> <body>
<div id="jq1"></div> <script>
//alert($("div")[0]);
//通过alert可以知道$("div")[0]是一个dom元素,后面可以通过符号.来点出一些style之类的属性
$(jq1)[0].style.width = "100px";
$(jq1)[0].style.height = "100px";
$(jq1)[0].style.background = "red";
$(jq1)[0].style.position = "absolute"; //通过alert可以知道$("div")是一个jq对象,后面可以通过符号.来点出一些已经封装好的方法
</script> </body> </html>
通过以上代码,可以看到css中我是没有设置样式的,只是初始化了一下,
而我通过一段jq代码,我给id为jq1的DIV设置了一个样式
如图就显示出来了

所以,可以在jq中修改样式,比在CSS里面高端了一点
JQuery笔记(一)jq的使用方法的更多相关文章
- JQuery笔记(二)jq常用方法animate()
在jq中,比较方便的是相对于js,jq封装了很多方法,很方便使用,下面我举几个常用的方法 animate()方法 <!DOCTYPE html> <html lang="e ...
- jQuery源码06-jQuery = function(){};给JQ对象,添加一些方法和属性,extend : JQ的继承方法,jQuery.extend()
/*! * Includes Sizzle.js 选择器,独立的库 * http://sizzlejs.com/ */ (function( window, undefined ) { //" ...
- Jquery笔记和ajax笔记
Jquery笔记:jQuery是一个JavaScript函数库,专为事件处理设计 1.jQuery的引入 <script text="type/javascript" src ...
- Python全栈之jQuery笔记
jQuery runnoob网址: http://www.runoob.com/jquery/jquery-tutorial.html jQuery API手册: http://www.runoob. ...
- jQuery笔记之 Ajax回调地狱
本次演示回调地狱: 模拟电影网站,判断用户是否为该网址的vip用户(最高权限为vip) 如果vpi就展示出vip电影,点击相应的电影显示出该电影的详细介绍 ---------------------- ...
- jquery中prop()方法和attr()方法
接着上一篇笔记的疑惑,找了下prop()方法和attr()方法的区别. 原来query1.6中新加了一个方法prop(),一直没用过它,官方解释只有一句话:获取在匹配的元素集中的第一个元素的属性值. ...
- JQuery笔记汇总
jQuery相关资料 官网: jQuery官网 在线API: jQuery在线API W3School:W3School-jQuery教程(中文版哦) 下载jQuery:jQuery各版本下载 jQu ...
- jquery里面的名称冲突解决方法
jQuery 使用 $ 符号作为 jQuery 的简介方式. 某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号. jQuery 使用名为 noConflict( ...
- 【jQuery】使用JQ来编写面板的淡入淡出效果
本文与上一篇的<[jQuery]使用JQ来编写最主要的淡入淡出效果>(点击打开链接)为姊妹篇. 但上一篇仅仅是对文本的基本控制,本篇则是对面板元素进行控制. 尽管功能上很类似,可是所用到的 ...
随机推荐
- SQL查询表的行列转换/小计/统计(with rollup,with cube,pivot解析)
SQL查询表的行列转换/小计/统计(with rollup,with cube,pivot解析) 2013-8-20 1. SQL查询表的行列转换/小计/统计(with rollup,with ...
- Fast Token Replacement in C#
http://www.codeproject.com/Articles/298519/Fast-Token-Replacement-in-Csharp Fast Token Replacement i ...
- poj 2378 树型dp
和poj1655那道求树的重心基本上一样的,代码也没多大改动. 详情请见 #include<cstdio> #include<algorithm> #include<cs ...
- 揭开Html 标签的面纱,忘不了的html .
Html :(Hypertext MarkupLanguage),是用于描述网页文档的一种标记语言,是一种标准,它通过标记符号来标记要显示的网页中的各个部分.其本身是一种文本文件,通过在文本文件中添 ...
- Oracle sql执行计划
explain plan explain plan for sql_statement select * from table(dbms_xplan.display) DBMS_XPL ...
- [日记&做题记录]-Noip2016提高组复赛 倒数十天
写这篇博客的时候有点激动 为了让自己不颓 还是写写日记 存存模板 Nov.8 2016 今天早上买了两个蛋挞 吃了一个 然后就做数论(前天晚上还是想放弃数论 但是昨天被数论虐了 woc noip模拟赛 ...
- asp.net如何把一个tostring类型转化为dateTime类型
Convert.ToDateTime(dr["consult_DealTime"].ToString()).ToString("yyyy-MM-dd"); co ...
- IPython与notebook 安装
基于 python2.7.13 32-bit版本安装 1.安装pyreadline https://pypi.python.org/pypi/pyreadline 下载对应的32位版本 2.用pip安 ...
- Vim插件之Command-T使用问题
最近在使用vim插件CommandT时出现问题其实就是vim没有支持ruby,不过google之后找到了解决方法,老外的态度还是很让人敬佩的,度娘搜索的结果太让人呕心了.. 贴下,以后再次遇到解决. ...
- android 开发心得杂记
1.Android周刊关注. 2.4季Android性能优化典范 胡凯 http://mp.weixin.qq.com/s?__biz=MzA4NTQwNDcyMA==&mid=4021354 ...