jQuery常见面试题之DOM操作详析

前言

关于JQ的DOM操作面试问题很多，可以从各个点问，所以列举几个常见问题，毕竟面试只是过程，重要的是知识自己掌握了。

面试题一：JQ中html()、text()和val()区别？

面试题二：JQ中find()、has()和filter()区别？

面试题三: closet()和parents()区别？

答案请在文中查找...

DOM操作有三类：DOM-core、HTML-DOM 、CSS-DOM

一、插入节点

我们用的最多的就是append和apendTo，其实共有8种方法。

插入节点

二、删除节点

remove() ：删除节点，并删除元素节点绑定的事件。

empty() ：清空节点元素的内容，类似$().html(' ') 。

三、克隆（复制）节点

$().clone() ，只复制节点，不复制方法和事件。

添加clone(true) ，不仅复制节点，也复制方法，也叫深度克隆。

四、替换节点

$('new').replaceWith('old')  ，返回new元素。

$('old').replaceAll('new') ，返回old元素。

如果在替换之前，已为元素绑定事件，替换后原有绑定事件将会被替换的元素一起消失，需要在新元素上重新绑定事件。

五、包裹节点

$('span').wrapAll('<div>') ：将所有元素用一个元素包裹。

wrap() ：将所有元素单独包裹。

wrapInner：包裹元素内容。

unwrap() ：删除包裹，删除父元素，不包含body。

六、遍历节点

children() ：只考虑子元素，不考虑后代元素。

next() ：同辈紧邻后面一个元素。

nextAll() ：同辈紧邻后面所有兄弟元素。

prev() ：同辈紧邻前一个兄弟元素。

prevAll() ：同辈紧邻前所有兄弟元素。

siblings() ：同辈所有兄弟元素。

find('span') ：返回被选元素的后代元素，括号内必填写，如果查找所有后代使用 "*"，起查找作用。

filter('div') ：指定选择器的xx元素，括号内必填写，符合条件的同级元素，非后代元素，起过滤作用。

has(‘div') ：符合条件的后代元素，不包含自身，括号内必填写，起过滤作用。

parents() ：获取所有祖先元素，参数为筛选条件。

closest(‘.new') ：用来取得最近的匹配元素，包括自身。首选检查自身是否符合，如果符合返回元素本身；如果不匹配，向上查找父元素，逐级向上直到匹配到选择器的元素。如果什么没找到，返回一个空的jq对象。必须填写筛选条件，且只能找到一个元素。

parentsUntil() ：截止到xx位置的祖先节点。

七、属性及样式操作

$().css() ：修改css样式。设置后，显示为内联样式。

$().attr('title') ：获取title属性。

$().removeAttr(title') ：删除title属性。

$().addClass(‘new') ：添加class的名字，不是选择器，故不是“.new”。

$().removeClass(‘new') ：与上相反。

$().toggle() ：

$().toggleClass() ：

$().hasClass() ：判断某元素是否有某个class。

八、内容操作

$().html() ：获取内容，含html标签，可以用于XHTML，但不能用于XML。

$().text() ：获取文本内容，不含标签。可以用于XHTML和XML，支持所有浏览器，原生innerText火狐不支持。

$().val() ：获取表单元素的内容。

下面说说三者的异同点：

异同点

九、其它节点操作

$('div').slice(1,4) ，获取满足条件的div。

$('div').add('p').css() ,自由组合添加样式，给div和p都添加公有的样式。

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对的支持。

# jquery常见面试题  # jquery  # dom对象  # dom  # jQuery移动和复制dom节点实用DOM操作案例  # jQuery的DOM操作之删除节点示例  # jQuery学习笔记之jQuery的DOM操作  # jQuery DOM操作 基于命令改变页面  # jQuery 选择器、DOM操作、事件、动画  # jQuery DOM操作小结与实例  # 浅谈jQuery 选择器和dom操作  # Jquery基础教程之DOM操作  # 锋利的jQuery jQuery中的DOM操作  # jquery中dom操作和事件的实例学习 仿yahoo邮箱登录框的提示效果  # jQuery DOM操作实例  # jQuery中DOM常见操作实例小结  # 绑定  # 括号内  # 面试题  # 选择器  # 符合条件  # 不包含  # 的是  # 几个  # 将会  # 最多  # 遍历  # 异同点  # 请在  # 火狐  # 不支持  # 不含  # 种方法  # 这篇文章  # 谢谢大家  # 表单 

相关文章： 图册素材网站设计制作软件,图册的导出方式有几种？  建站之星免费版是否永久可用？  招贴海报怎么做,什么是海报招贴？  制作网页的网站有哪些,电脑上怎么做网页？  制作销售网站教学视频,销售网站有哪些？  如何在云主机上快速搭建多站点网站？  公司网站的制作公司,企业网站制作基本流程有哪些？  黑客如何利用漏洞与弱口令入侵网站服务器？  整蛊网站制作软件,手机不停的收到各种网站的验证码短信,是手机病毒还是人为恶搞?有这种手机病毒吗？  网站制作软件免费下载安装,有哪些免费下载的软件网站？  义乌企业网站制作公司,请问义乌比较好的批发小商品的网站是什么？  高防服务器租用首荐平台，企业级优惠套餐快速部署  如何在云主机快速搭建网站站点？  建站之星如何保障用户数据免受黑客入侵？  番禺网站制作公司哪家值得合作,番禺图书馆新馆开放了吗？  建站之星北京办公室：智能建站系统与小程序生成方案解析  Swift开发中switch语句值绑定模式  交易网站制作流程,我想开通一个网站，注册一个交易网址，需要那些手续？  建站之星安装提示数据库无法连接如何解决？  C++ static_cast和dynamic_cast区别_C++静态转换与动态类型安全转换  家具网站制作软件,家具厂怎么跑业务？  如何通过cPanel快速搭建网站？  浅谈Javascript中的Label语句  寿县云建站：智能SEO优化与多行业模板快速上线指南  如何用PHP快速搭建CMS系统？  如何选购建站域名与空间？自助平台全解析  高端智能建站公司优选：品牌定制与SEO优化一站式服务  如何选择建站程序？包含哪些必备功能与类型？  沈阳个人网站制作公司,哪个网站能考到沈阳事业编招聘的信息？  建站org新手必看：2024最新搭建流程与模板选择技巧  C#如何使用XPathNavigator高效查询XML  建站主机与服务器功能差异如何区分？  建站主机SSH密钥生成步骤及常见问题解答？  香港网站服务器数量如何影响SEO优化效果？  如何在万网自助建站平台快速创建网站？  网站制作的软件有哪些,制作微信公众号除了秀米还有哪些比较好用的平台？  高端网站建设与定制开发一站式解决方案 中企动力  如何在阿里云虚拟主机上快速搭建个人网站？  外贸公司网站制作,外贸网站建设一般有哪些步骤？  微信h5制作网站有哪些,免费微信H5页面制作工具？  建站之星2.7模板：企业网站建设与h5定制设计专题  如何通过商城自助建站源码实现零基础高效建站？  如何挑选优质建站一级代理提升网站排名？  早安海报制作网站推荐大全,企业早安海报怎么每天更换？  如何在云主机上快速搭建网站？  临沂网站制作企业,临沂第三中学官方网站？  如何通过远程VPS快速搭建个人网站？  建站OpenVZ教程与优化策略：配置指南与性能提升  如何快速搭建高效WAP手机网站？  如何在自有机房高效搭建专业网站？