本文实例讲述了jQuery实现对网页节点的增删改查功能。分享给大家供大家参考,具体如下:
前面介绍过《Javascript针对网页节点的增删改查用法》,其实Javascript对DOM的操作已经总结了很久的,而对于jQuery对网页节点的操作,虽然一直在用,但一直没有好好总结一下,实在是不应该。
下面举同样的例子来说明这个问题:
如上图,提供3个按钮,1个下拉列表,1个输入框,提供增删改查的操作。
网页中最多10个节点,最少0个节点,多了不让加,少了不让减。
首先是本网页的基本布局:
jQuery对网页节点的增删改查
选择节点
首先引入jQuery资源,之后,除了下拉列表以外其余节点没有ID,以展示两个Jquery获取节点的方式,一种通过id直接获取,一种通过获取子节点的方式的获取。
这里没什么特别的,关键是下面的jQuery编程:
可以看到,这里jQuery设置css是先指明要修改的css属性,再写上要修改的内容,Javascript修改css则是对节点的style修改。
jQuery对节点的遍历,用each方法则可以。Javascript则要对要遍历的节点,赋予name,然后利用document.getElementbyName将所有name拿下,则进行遍历。
jQuery删除一个节点,比Javascript简便多了,一个remove()搞掂一切,Javascript则要找自己的父节点测能删除自己。
jQuery找子节点,可以直接用>符号来查看,Javascript则要通过xx.getElementsByTagName去查找。
更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery操作DOM节点方法总结》、《jQuery页面元素操作技巧汇总》、《jQuery常用插件及用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。



