1. jQuery 中, $(document).ready()是什么意思?
当DOM已加载完毕后,执行ready()内容。
2. $node.html()和$node.text()的区别?
<body>
<div class="test">
<p>这是一段测试</p>
</div>
<script>
console.log($('.test').html()) //输出结果:<p>这是一段测试</p>
console.log($('.test').text()) //输出结果:这是一段测试
</script>
</body>
$node.html()
获取对象的Html结构
$node.text()
获取对象的text
3. $.extend 的作用和用法?
用法:jQuery.extend( target [, object1 ] [, objectN ] )
,将两个或更多对象的内容合并到第一个对象,也可用于深拷贝。
<script>
var target = {}
$.extend(target,{a:1, b:2},{c:3})
console.log(target) //{ a: 1, b: 2, c: 3}
</script>
4. jQuery 的链式调用是什么?
jQuery调用相关api之后会返回一个该方法处理过后的jQuery对象(回调),这样可以在一条语句中调用多种API。
5. jQuery 中 data 函数的作用
在匹配元素上存储任意相关数据 或 返回匹配的元素集合中的第一个元素的给定名称的数据存储的值
<div class="test">
<p>这是一段<span>测试</span>测试</p>
</div>
<script>
$(".test").data("add", "测试");
$(".test").data("addMath", { time: "7.28"});
console.log($(".test").data()); //{add: "测试", addMath: {time: "7.28"}}
console.log($(".test").data("add")) //"测试
6.写出以下功能对应的 jQuery 方法:
<style>
.active{
color: red;
}
</style>
</head>
<body>
<div id="test">
<h2>这是一个测试</h2>
![image](https://img.haomeiwen.com/i6470442/dbbb2c3b010bc4ad.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
</div>
<script>
$('div>h2').addClass('active') //增加active样式
$('div>h2').removeClass('active') //删除acvtive样式
$('div>img').css('display','block') //显示隐藏元素
$('div>img').css('display','none') //隐藏元素
$('div').attr('id') //获取id属性
$('div>img').attr('src') //获取src属性
$('div>img').attr('title') //获取title属性
$('div').attr('id','task')
console.log($('div').attr('id')) //修改id值,输出id值为'task',src、title同理
$('div').attr('data-src','') //添加自定义属性
$('div').prepend('<p>放在内部的最开头</p>') //开头插入
$('div').append('<p>放在内部的最末尾</p>') //末尾插入
$('div>h2').remove() //删除元素
$('div').empty() //清空元素
$('div').html('<div class="btn">这是设置的html元素</div>') //设置html元素
$('div').height() //获取不包含内边距的高度;.width()获取不包含内边距的宽度
$('div').height('40px') //设置高度;.width('40px')同理
$('div').innerHeight() //获取包含内边距的高度
$('div').outerHeight() //获取包含边框的高度
$('div').outerHeight(true) //获取包含外边距的高度
$(window).scrollTop() //获取窗口滚动条垂直滚动距离
$('div').offset() //获取$node 到根节点水平、垂直偏移距离
$('div').css({'color': 'red','font-size':'14px'})
$('div').each(function(index,node){
var str = $(node).text() + $(node).text()
$(node).text(str)
}) //遍历节点,把每个节点里面的文本内容重复一遍
$('div').find('.item') //查找 class 为 .item的子元素
$('div').children() //获取$ct 里面的所有孩子
$node.parents('.ct').find('.panel') //向上找到 class 为'.ct'的父亲,在从该父亲找到'.panel'的孩子
$node.length //获取选择元素的数量
$node.index() //获取当前元素在兄弟中的排行
后台代码
app.get('/loadMore', function(req, res){
var curIdx = req.query.index
var len = req.query.length
var data = []
for(var i = 0; i < len; i++){
data.push('内容' + (parseInt(curIdx) + i))
}
res.send(data)
})
网友评论