一、目录:
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("未匹配到客户");
}
},
});
}
});