前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >jQuery常用的功能

jQuery常用的功能

作者头像
挑战者
发布2018-06-29 16:13:42
1.1K0
发布2018-06-29 16:13:42
举报
文章被收录于专栏:java沉淀java沉淀

一、目录:



1.ready(function(){})方法的使用

2.require最常用的方法:

3.display:none

4.visible:hidden

5.修改span的字体的颜色

6.window对象中self、 top 的区别

7.blur事件的使用

二.、内容:

1. ready(function(){})

```$(document).ready(function(){

// 当网页加载完成后执行这里的代码块

});```

2.require('http') 内置模块

```

require('./server')  “./”表示当前路径,后面跟的是相对路径

require("../lib/server") ../表示上一级目录,后面跟的也是相对路径

对js中的 require('./jquery.gritter.js')($);的解释如下:

require是必须校验

./jquery.gritter.js是参数,表示一个js。

($)表示追加当前对象到调用处

```

3.display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗来说就是看不见也摸不到。

4.visible:hidden--- 使对象在网页上不可见,但该对象在网页上所占的空间没有改变,通俗来说就是看不见但摸得到。

5.span标签:无语义行内元素。

在段内定义与该段样式不同的内容的样式。

同时满足以下条件的内容你可以使用span标签:

1、行内元素(inline)

2、无语义

3、你需要给他添加特定样式或做js钩子的时候

标准属性有:id, class, title, style, dir, lang, xml:lang

事件属性有:onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

如:

这是一段话,段落里有一些特殊的需要标记的内容,如红色。

这是一个箭头:.。可以通过定义该class使其显示为一个箭头。

你还可以输入140 个字。J_zishu用作js钩子

链接:https://www.zhihu.com/question/20083052/answer/13916461

```

实例一(完成代码):

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

/* 修改span的字体的颜色 */

span{  color:red;

}

.hfont{

border-color:green;

font-weight:900;

}```

实例二:

实例三:

在span中加style属性:让字体加粗变黑

6.window窗口对象中的属性self,top.

1)self:当前窗口对象(如果是在iframe里,则为该框架的窗口对象)

2)、top:父窗口对象

3)、window:典型情况下,浏览器会为每一个打开的html创建对应的window对象,如果这 个文档包含了多个框架,则浏览器会为原始文档建立一个window对象,再为每个框架创建额外的window对象。可以再当前窗口中直接使用window 的全部属性、方法和集合,即不需要在前面附加计算结果为当前window对象的表达式。虽然window可以省略,但是为了方便阅读以及避免一些漏洞,一 般都使用这个关键字。

4)、location:该对象包含当前url信息,拥有多个属性。默认属性为 location.href,表示整个url,即如果设置location="http://www.ddd.cn",则等同于location.href="http://www.ddd.cn".

如果test.html被加入iframe,则跳转到百度页面。

top.location.href:为引用test.html页面url的父窗口对象的url

self.location.href:为引用test.html页面url的子窗口对象url

self.location 指的是当前页面的location

top.location是指当前页面所属的父页面的location

top.location !== self.location

7.blur事件的使用

$("#customerId").blur(function(){

var customerId = $("#customerId").val();

- //判断客户id是否为空串

if($('#customerId').val() == "") {

$("#customerIdspan").text("");

$('#customerIdSpan').html("客户id不能为空!");

$('#customerId').focus()

}else{

//如果不为空串,根据客户id,发送ajax查询客户信息

$.ajax({

url: "/json/query_customer.htm",

data: {"customerId":customerId},

type: 'get',

dataType: 'json',

success: function(jsonObject) {

if(jsonObject.success){

$("#customerIdSpan").text("");

$("#customerIdspan").text("");

var customerId = jsonObject.data.customerId

var customerName=jsonObject.data.customerName

var customerBizCategory=jsonObject.data.customerBizCategory

//把查询的数据回现到,

$("#customerId").val(customerId);

$("#customerIdspan").text(customerName);

}else{

$("#customerIdspan").text("");

$("#customerIdSpan").text("未匹配到客户");

}

},

});

}

});

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2016.06.23 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档