Web前端JQuery面试题(二)
web前端jquery面试题(二)
1.请写出jquery的语法?
<script type="text/javascript"> $(document).ready(function(){ // 程序段 }) </script> window.onload=function(){ // 程序段 } 前者效率高 $(function(){ // 程序段 })
2.请问什么是dom
对象?
dom
对象,dom
为文本对象模型,dom
的每一个页面都是一个dom
对象。通过javascript
方法获取页面元素的对象,就是dom
对象。
var txt = document.getelementbyid("text").value;
3.请问什么是jquery
对象?
通过jquery
自身的方法获取页面元素的对象,就是jquery对象。
var txt = $("#text").val(); $("#text").toggleclass("txtclick").html("点击后切换样式");
4.jquery
选择器有哪些?
jquery
选择器有:基本选择器,层次选择器,过滤选择器,表单选择器四大类。
过滤选择器分6种:简单过滤选择器,内容过滤选择器,可见性过滤选择器,属性过滤选择器,子元素过滤选择器,表单对象属性过滤选择器。
基本选择器:
#id 根据给定的id进行匹配一个元素 element 根据给定的元素名进行匹配所有元素 .class 根据给定的类匹配该类的所有元素 * 匹配所有元素 selector1,selector2 匹配给定的元素,合并一起
层次选择器:
ancestor descendant 根据祖先元素匹配所有后代的元素 祖先和后代的关系 parent > child 根据父元素匹配所有的子元素 父子的关系 prev + next 根据prev元素匹配后面的所有相邻元素 于.next()相同,prev元素后的下一个元素 prev ~ siblings 匹配prev元素后的所有兄弟元素 于.nextall()相同,prev元素后的所有相邻元素,获取元素后面的全部相邻元素 .siblings()方法,获取前后所有相邻的元素
简单过滤选择器器:
:animated 获取执行正在动画效果的元素 :header 获取所有标题类型的元素 :lt(index) 获取小于给定索引值的元素 :gt(index) 获取大于给定索引值的元素 :eq(index) 获取给定的索引值的元素,从0开始 :odd 获取奇数的元素 :even 获取偶数的元素 :not(selector) 获取除给定选择器外的所有元素 first() 或 :first 获取第一个元素 last() 或 :last 获取最后一个元素
内容过滤选择器:
:contains(text) 获取包含给定文本的元素 :empty 获取所有不包含子元素或文本的空元素 如:<div></div> :has(selector) 获取含所选择器的所有元素 :parent 获取含有子元素或文本的元素 如:<div>dashu</div>, <div><p></p></div>
可见性过滤选择器:
:hidden 获取所有不可见元素 :visible 获取所有的可见元素
属性过滤选择器:
[attribute] 获取给定属性的元素 [attribute = value] 匹配给定的属性是某个特定值的元素 [attribute != value] 匹配所有不含有特定的属性 [attribute ^= value] 匹配给定的属性以某值开始的元素 [attribute $= value] 匹配给定的属性以某值结尾的元素 [attribute *= value] 匹配有包含某些值的特定元素 [selector1][selector2] 同时满足多个条件使用
子元素过滤选择器:
:nth-child 从1开始的,匹配每个父元素下第n个元素 $("ul li:nth-child(2)"); 获取2 3 4。。 :first-child 匹配每个父元素下的第一个子元素 :last-child 匹配每个父元素下的最后一个子元素 :only-child 匹配父元素中只有唯一的子元素,如果父元素中有多个子元素,就不会被匹配
表单对象属性过滤选择器:
:enabled 匹配所有可用元素 :disabled 匹配所有不可用元素 :checked 匹配所有选中元素 :selected 匹配所有选中option元素
表单选择器:
:input 会获取所有input,textarea,select,button :text 匹配所有单行文本元框 :password 匹配所有密码框 :radio 匹配所有单选按钮 :checkbox 匹配所有复选框 :submit 匹配所有提交按钮 :image 匹配所有图像 :reset 匹配所有重置按钮 :button 匹配所有按钮 :file 匹配所有文本域
5.请问你能写出dom
结构吗?
html下head,body
head下title,style
body下table,div,p,ul
table下tr
div下span
ul下li
6.给定属性操作,描述作用
attr():
可以获取元素的属性和属性值
attr(key,value):
可以设置元素的属性
removeattr():
可以删除指定的属性
html():
获取html内容html(val):
设置html内容
text():
获取元素的文本内容text(val):
设置元素的文本内容
val():
获取元素的值val(val):
为元素设置值val().join(","):
获取选中的多个选项值,用于获取select中多个选项值
设置元素样式
css(name,value); name
样式名称,value样式值
添加样式
addclass(class) 和 addclass(class0 class1 ...)
切换样式
toggleclass(class)
如果有该类class就删除,如果没有就添加
进行方法间的切换效果
删除类
removeclass(class);
创建节点元素,动态创建页面元素: $(html)
var $p = $("<p>dashucoding</p>");
内部插入
append(content) :
向所选择的元素内部插入内容$("body").append($div);
append(function (index,html))
同上
appendto:
把选择的元素追加到另一个指定的元素中
appendto(content)
将一个元素插入另一个指定的元素中
前部分的内容插入其后部分的内容
$("span").appentto($("div"));
prepend(coontent):
向每个所选择的的元素内部前置内容prepend(function(index,html))
prependto(content)
外部插入
after(content):
向所选择的元素外部后面插入内容after(function)
before(content):
向所选择的元素外部前面插入内容before(function)
insertafter(content)
选择的元素插入另一个元素外部后面insertbefore(content)
选择元素插入另一个元素外部前面
复制节点
clone()
复制元素本身和clone(true)
复制元素和所有功能
$(this).clone().appendto("span"); 和 $(this).clone(true).apendto("span");
替换节点
replacewith(content)
将选择的元素替换成指定内容
$("span").replacewith("<p>dashu</p>");
replaceall(selector)
将选择的元素替换成指定的selector的元素
$("<p>dashu</p>").replaceall("#text");
包裹节点
wrap(html):
将所有选择的元素用其他字符串代码包裹起来wrap(elem):
将所有选择的元素用其他dom元素包裹起来
wrap(fn)
unwrap()
移除所选元素的父元素或包裹的标记
wrapall(html),wrapall(elem)
wrapinner(html),wrapinner(elem)
wrapinner(fn)
wrap(html), wrapinner(html); 包裹外部元素 包裹元素内部的文本 <p><span>da</span></p> $("p").wrap("<b></b>"); <b><p><span>da</span></p></b> $("span").wrapinner("<i></i>"); <p><span><i>da</i></span></p>
遍历元素
each()
方法进行元素的遍历
删除元素
remove()
删除该元素和empty()
清空全部节点或所有后代元素
结言
好了,欢迎在留言区留言,与大家分享你的经验和心得。
感谢你学习今天的内容,如果你觉得这篇文章对你有帮助的话,也欢迎把它分享给更多的朋友,感谢。
达叔小生:往后余生,唯独有你
you and me, we are family !
90后帅气小伙,良好的开发习惯;独立思考的能力;主动并且善于沟通
简书博客: 达叔小生
结语
- 下面我将继续对 其他知识 深入讲解 ,有兴趣可以继续关注
- 小礼物走一走 or 点赞
上一篇: 妙!7个瑜伽动作让胸围暴涨
下一篇: 关于力扣第一题 ---两数之和(多方法)