了解jQuery—DOM简单操作

append()与prepend()

append() 方法在被选元素的结尾插入指定内容。如果需要在被选元素的开头插入内容实用prepend()。

$("body").prepend("<h1>开始</h1>")

$("body").append("<h6>结束</h6>")
before()与after()

before() 方法在被选元素之前插入指定的内容。
after() 方法在被选元素后插入指定的内容。

$('p').before("<b>段落之前插入</b>")

$('p').after("<b>段落之后插入</b>")
remove()

remove() 方法移除被选元素,包括所有的文本和子节点。
该方法也会移除被选元素的数据和事件。

 $('p').remove()
移除页面上所有的p元素。
empty()

empty() 方法从被选元素所有子节点和内容。该方法不会移除元素本身,或它的属性。

$("div").empty()
清空div中的内容
html()

html() 方法设置或返回被选元素的内容(innerHTML)。当该方法用于返回内容时,则返回第一个匹配元素的内容。当该方法用于设置内容时,则重写所有匹配元素的内容。

$("div").html()  返回页面上第一个div元素的内容。
$("div").html("Hello <b>world!</b>")  改变所有div元素的内容:
text()

text() 方法设置或返回被选元素的文本内容。当该方法用于返回内容时,则返回所有匹配元素的文本内容(会删除 HTML 标记)。当该方法用于设置内容时,则重写所有匹配元素的内容。

$("p").text()  返回所有p元素的文本内容
$("p").text("Hello world!")  改变所有p元素的文本内容
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第1章 简介 第2章 DOM节点的创建 2-1 DOM创建节点及节点属性 通过JavaScript可以很方便的获...
    mo默22阅读 831评论 0 8
  • DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上...
    阿r阿r阅读 1,035评论 0 9
  • 一、样式篇 第1章 初识jQuery (1)环境搭建 进入官方网站获取最新的版本 http://jquery.co...
    凛0_0阅读 3,443评论 0 44
  • 我是腐烂了花期的凶手,你是藏起了花瓣的牧童。从此你把鲜艳的衣服褪下,好像冬季不再红墙绿瓦。
    FezDirk阅读 191评论 0 0
  • 前晚有个朋友问华哥 哪里可以找到一些标签微信群 很多人都会认为 想要获取一些标签微信群 找不到好的获取渠道 真的有...
    华俊竹阅读 7,955评论 0 1