jQuery简介

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/ZCMUCZX/article/details/78996350

jQuery其实是一个轻量级 JavaScript框架,它可以让我们能够方便的去处理HTML文档,兼容各种浏览器,支持CSS3的布局,它方便了我们修改页面的表现,以及能够用简单的代码给界面添加动画,而且还方便了我们对事件的处理,我们还可以在其中去进行CSS样式的修改,jQuery实际上就是一个外部的js的文件,我们如果要去使用的话其实直接进行导入这个js文件就可以了。


如果我们自己去写JS代码的话,可能会存在以下的问题

1、浏览器兼容问题

2、如果有复杂的dom操作需要我们自己去写大量的代码

3、复杂的动画和特效也都需要我们自己去写

4、跨域访问的问题,跨域访问其实简单的说就是 A 网站的 javascript 代码试图访问 B 网站去提交内容和获取内容等。


jQuery的优点

1、很好的解决了浏览器的兼容问题

2、能够简单的去实现Dom操作和动画

3、有多种的网络请求方案


下面简单的介绍下它的用法,在jQuery中到处都能见到这个符号$,而$()这个代表的就是jQuery中的一个对象

我们这样就可以拿到img标签

$("img")
返回img标签的src值的话,我们可以这么做,也就是说下面的attr其实就是拿到标签中的属性

$('img').attr('src')
修改标签中的属性,举个例子下面的就是把所有的img标签的src的值都给改了

$('img').attr('src','img/HBuilder.png');
批量进行修改属性

$('img').attr({src:'img/HBuilder.png',width:'500px'});

拿到标签内容,下面拿到p标签的内容

$('p').text()
改变标签的内容,例如下面我们修改的是p标签

$('p').text('嘿嘿');
获取数组中的元素监听点击事件,比如说我们有两个按钮

<button>显示</button>
<button>隐藏</button>
我们想去获取第一个并且去监听点击事件的话可以这么做,就比如说我们点击显示按钮让所有的图片隐藏,hide方法就是隐藏显示的图片

$('button').eq(0).on('click',function (){
    $('img').hide();
})
与之相反的就是show方法就是展示,就是显示隐藏的图片

$('img').show();
遍历数组

$.each(["a","b","c"],function(index,value){
        console.log(index+value);
        });
获取相应的元素在数组里面的角标

var array1 = ["a","b","c"];
console.log($.inArray('b',array1));
写CSS的样式

 $('p').css({
  background:'red',
 });





没有更多推荐了,返回首页