jQuery对html的操作总结

 时间:2024-11-10 21:56:32

1、第一个函数,添加html元素。append()这个函数功能很强大,可以用js对html元素加工,然后再用这个函数输出。使用方法:$(selector).append("html代码");这样会输出html的内容到选择器里后面(结尾)。由于要输入到选择器里,选择器应该是一个容器,如:table,p。不会覆盖已有内容。

jQuery对html的操作总结
jQuery对html的操作总结

2、第二个函数,添加html元素。appendto()和append()类似。使用方法:$("html代码").appendto(selector);这样会输出html内容到选择器里后面(结尾)。由于要输入到选择器里,选择器应该是一个容器,如:table,p。不会覆盖已有内容。

jQuery对html的操作总结

3、第三个函数,添加html元素。after()和append()或appendto()不一样的是,它可以有无限个参数。使用方法:$(selector).after("html元素1","html元素2","html元素3",……);当然,你可以把含有html元素的字符串全部连起来,变成一个,再用append()输出。这样会输出html内容到选择器外后面(结尾)。当然,选择器不必是一个容器,例如:img。不会覆盖已有内容。

jQuery对html的操作总结

4、第四个函数,添加html元素。before()和after()差不多使用方法$(selector).before("html元素1","html元素2","html元素3",……);这样会输出html内容到选择器外前面(开头)。当然,选择器不必是一个容器,例如:img。不会覆盖已有内容。

jQuery对html的操作总结

5、第五个函数,添加/更改html元素。html()使用方法:$(selector).html("html元素");略有不同的是,这个东西会覆盖已有内容!!!输出到选择器里。所以选择器是一个容器,如:table。覆盖已有内容,可以实现无刷新页面改!

jQuery对html的操作总结
jQuery对html的操作总结
jQuery对html的操作总结

6、第六个函数,删除html元素。remove()使用方法:$(selector).remove();这样会删除选择器对应的html元素,注意:html元素所含有的所有绑定的事件、附加的数据(如onclick事件)也会被删除。可以和添加html元素的函数一起使用,移动HTML元素。注意:移动后HTML元素的保留所有绑定的事件、附加的数据就没了!使用方法:$(selector2).append($(selector1).remove());这样selector1的HTML元素就会移动到selector2中。

jQuery对html的操作总结
jQuery对html的操作总结

7、第七个函数,删除html元素。detach()使用方法:$(selector).detach();和remove稍有不同的是,这个函数不会删除HTML元素的所有绑定的事件、附加的数据(如onclick事件)。当然,可以和添加html元素的函数一起使用,移动html元素。保留其保留所有绑定的事件、附加的数据。使用方法:$(selector2).append($(selector1).detach());这样selector1的HTML元素就会移动到selector2中。

jQuery对html的操作总结
jQuery对html的操作总结

8、第八个函数,回复html元素。prepend()使用方法:x=$(selector1).detach();$(selector2).prepend(x);这样可以恢复被删除的HTML元素,恢复后有没有所有绑定的事件、附加的数据视删除函数而定。单独使用prepend可以添加HTML元素到选择器的开头,使用方法与append差不多。还有一个函数是prependto(),类似于append()与appendto()的关系。

jQuery对html的操作总结
jQuery对html的操作总结
  • jquery跳转页面的方法
  • html怎么快速引入jQuery文件
  • Jquery动画效果简单总结
  • jquery问题:[3]JQuery技术总结
  • 热门搜索
    爱的手抄报图片 有关梦想的手抄报 日行一善手抄报名言 法制校园手抄报 有关节约用水的手抄报 关于爱鸟护鸟的手抄报 爱国的手抄报内容 法制手抄报版面设计图 寒假手抄报大全 四年级数学手抄报图片