JQuery基础语法小结
更新时间：2015年02月27日 15:02:12 投稿：hebedich
在日常开发中JQuery是我们使用最频繁的JS库。使用JQuery进行开发，你需要先了解JQuery的基本语法。下面是在学习JQuery时总结的一些简单语法。
1、$(document)将document对象转换为jquery
复制代码 代码如下:
$(document).ready(function(){
alert("hello world");
});
2、获取所有的超链接对象，并且增加onclick事件；其实在底层jquery对象获得的每个标签的数组，因此我们不需要进行循环了
复制代码 代码如下:
$(document).ready(function(){
$("a").click(function(){
alert("hello world");
});
});
3、jquery对象与dom对象之间的转换
复制代码 代码如下:
$(document).ready(function(){
var javascriptElement = document.getElementById("clickme");
//将dom对象转换为jquery对象
var jqueryElement = $(javascriptElement);
//alert("javascript:" + javascriptElement.innerHTML);//innerHTML获取标签的内容
//alert("jquery:" + jqueryElement.html());
//将jquery转换为dom对象方式一
var jElement = $("#clickme");
var javascriptEle = jElement[0];
alert("jquery1: " + javascriptEle.innerHTML);
//方式二
var javascriptEle2 = jElement.get(0);
alert("jquery2: " + javascriptEle2.innerHTML);
});
4、jquery解决id值是否存在的问题
复制代码 代码如下:
<a id="hello">click me</a>
<script type="text/javascript">
//以传统方式解决id为空方式一
if(document.getElementById("helllo")) {
//如果hello不存在会出错
document.getElementById("helllo").style.color ="red";
}
//方式二
//$("#hello")[0].style.color="red";
//用jquery解决
$("#hello").css("color","red");
//如果只有一个参数，则此方法是读，如果是两个参数则是些功能（css（“”），css（“”，“”））
alert($("#hello").css("color"));
</script>
5、在javascript中规定，你要操作css属性时要将属性中的‘-'去掉，同时把后一个字母大写；如：background-color 要改成 backgroundColor
6、jquery中也使用选择器来操纵各种各样的元素。是继承了css的设计理念，但是把它更是发扬光大了；
7、jquery的几种书写形式
1> 方式一
复制代码 代码如下:
$("document").ready(function(){
...
});
2> 方式二
复制代码 代码如下:
$().ready(function(){
...
});
3> 方式三
复制代码 代码如下:
$(function(){
...
});
以上几种方式是一样的
希望本文所述对大家学习jquery程序设计能有所帮助。
相关文章
jquery判断checkbox是否选中及改变checkbox状态的实现方法
下面小编就为大家带来一篇jquery判断checkbox是否选中及改变checkbox状态的实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-05-05
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
之前项目中才用了Easy-ui，但是在同时使用tree和grid的效果时，因为页面有俩个URL,分别为Ajax树去后台取数据和Grid取数据，在IE9以上以及其他浏览器里都没有问题，在Ie低版本时会出现先加载表格，然后一闪而过加载树渲染页面，造成页面只有tree数据而没有表格grid数据。2014-06-06
Jquery中dialog属性小记，使用jquery dialog的朋友可以参考下。2010-09-09
这篇文章主要介绍了jQuery实现图片走马灯效果的原理,结合实例形式较为详细的分析了jQuery实现走马灯的相关html页面设计、css样式布局与jQuery相关函数的使用,需要的朋友可以参考下2016-01-01
这篇文章主要介绍了jQuery实现的简单图片轮播效果,结合完整实例形式分析了jQuery结合时间函数与随机数运算操作页面元素动态变换相关实现技巧,具有不动方向滑动、淡入淡出等切换效果,代码非常简单实用,需要的朋友可以参考下2018-02-02
这篇文章主要为大家介绍了jquery编写弹出信息提示条并延时滑出动画实现示例,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2023-08-08
这篇文章主要介绍了jQuery each和js forEach用法,结合实例形式对比分析了jQuery each和js forEach具体使用方法及相关操作注意事项,需要的朋友可以参考下2019-02-02
这篇文章主要介绍了jquery控制显示服务器生成的图片流,需要的朋友可以参考下2015-08-08
通过这篇文章你可以得到以下收获JQUERY操作JSON的一些实现方法。2010-02-02
使用jquery的ajax需要注意的地方dataType的设置
没有设置dataType:'json',就出现无法解析返回的data数据，会把data当作字符串处理，而不是json对象，记得以前是不用设dataType的，很奇怪，不知道是不是跟jquery版本有关系2013-08-08
最新评论