jQuery 中, $(document).ready()是什么意思?
就是等页面加载好了之后再执行这个函数
$node.html()和$node.text()的区别?
$node.html()可以获取和设置node里面的数据,包括html标签
$node.text()只能设置和获取里面的文本
$.extend 的作用和用法?
作用:1.当我们提供两个或多个对象给$.extend(),对象的所有属性都添加到目标对象(target参数)。
2.如果只有一个参数提供给$.extend(),这意味着目标参数被省略。在这种情况下,jQuery对象本身被默认为目标对象。这样,我们可以在jQuery的命名空间下添加新的功能。这对于插件开发者希望向 jQuery 中添加新函数时是很有用的
例:var a = { name: xiaoming, age: 18, sex: boy }; var b = { name: xiaohong, age: 19, sex: girl }; $.extend(a,b); console.log(a);//{name: xiaohong,age: 19, sex: girl}
jQuery 的链式调用是什么?
链式调用:使用jQuery方法时,对象方法返回的是对象本身,可以调用对此对象的其他jQuery方法,实现连续调用多个方法
例:$(this).siblings().removeClass('active');
jQuery 中 data 函数的作用
data()函数用于在当前jQuery对象所匹配的所有元素上存取数据。
通过data()函数存取的数据都是临时数据,一旦页面刷新,之前存放的数据都将不复存在。该函数属于jQuery对象(实例)。如果需要移除通过data()函数存放的数据,请使用removeData()函数。
写出以下功能对应的 jQuery 方法:
给元素 $node 添加 class active,给元素 $noed 删除 class active
$node.addClass('active'); $node.removeClass('active')
展示元素$node, 隐藏元素$node
$node.show(300,function(){}) $node.hide(300,function(){})
获取元素$node 的 属性: id、src、title, 修改以上属性
$node.attr('id'); $node.attr('src'); $node.attr('title'); $node.attr({'id': 'box', 'src':'xxx', 'title':'jirengu'})
给$node 添加自定义属性data-src
$node.attr('data-src': 'http:/xxx.com')
在$ct 内部最开头添加元素$node
$ct.preappend($node)
在$ct 内部最末尾添加元素$node
$ct.append($node)
删除$node
$node.remove()
把$ct里内容清空
$node.empty()
在$ct 里设置 html <div class="btn"></div>
$ct.html('<div class="btn"></div>')
获取、设置$node 的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)
$node.width() - 返回元素的宽度。//括号里写值就是设置,没有则返回 $node.height() - 返回元素的高度。//括号里写值就是设置,没有则返回 $node.innerWidth() 方法返回元素的宽度(包括内边距)。 $node.innerHeight() 方法返回元素的高度(包括内边距)。 $node.outerWidth() 方法返回元素的宽度(包括内边距和边框)。 $node.outerHeight() 方法返回元素的高度(包括内边距和边框)。 $node.outerWidth(true) 方法返回元素的宽度(包括内边距、边框和外边距) $node.outerHeight(true) 方法返回元素的高度(包括内边距、边框和外边距)。
获取窗口滚动条垂直滚动距离
$(document).scrollTop();
获取$node 到根节点水平、垂直偏移距离
$node.offset()
修改$node 的样式,字体颜色设置红色,字体大小设置14px
$node.css({ 'color': red, 'font-size': 14px, })
遍历节点,把每个节点里面的文本内容重复一遍
$node.each(function(){ console.log($(this).text()) })
从$ct 里查找 class 为 .item的子元素
$ct.find(".item")
获取$ct 里面的所有孩子
$ct.children()
对于$node,向上找到 class 为'.ct'的父亲,在从该父亲找到'.panel'的孩子
$node.parents('.ct').find('.panel')
获取选择元素的数量
$node.length
获取当前元素在兄弟中的排行
$node.index()
用jQuery实现以下操作
当点击$btn 时,让 $btn 的背景色变为红色再变为蓝色
当窗口滚动时,获取垂直滚动距离
当鼠标放置到$div 上,把$div 背景色改为红色,移出鼠标背景色变为白色
当鼠标激活 input 输入框时让输入框边框变为蓝色,当输入框内容改变时把输入框里的文字小写变为大写,当输入框失去焦点时去掉边框蓝色,控制台展示输入框里的文字
当选择 select 后,获取用户选择的内容
https://shaozhiyuan.github.io/blog/进阶15题目7