{site_name}

{site_name}

🌜 搜索

jQuery 文档操作指的是使用 jQuery 库对 HTML 文档中的元素进行增删改查等操作

前端 𝄐 0
jquery文件操作,jquery的文档处理,jquery帮助文档,jquery 基本操作,jquery1,jquery(document).ready
jQuery 文档操作指的是使用 jQuery 库对 HTML 文档中的元素进行增删改查等操作。这些操作可以使得 JavaScript 代码更加简洁、易读和易维护。

下面是一些常见的 jQuery 文档操作及其示例:

1. 选取元素

使用 $() 函数可以选取文档中的元素,其中传入的参数可以是元素的标签名、类名、ID 等等,具体可以参考 CSS 选择器语法。

javascript
// 选取所有 p 标签
$('p')

// 选取 ID 为 'my-heading' 的元素
$('#my-heading')


2. 添加元素

使用 .append()、.prepend()、.before()、.after() 等函数可以向文档中添加元素。

javascript
// 在 body 元素的末尾添加一个 div 元素
$('body').append('<div></div>')

// 在 ID 为 'my-div' 的元素前添加一个 p 元素
$('#my-div').before('<p>Hello world!</p>')


3. 移除元素

使用 .remove() 函数可以从文档中移除一个元素。

javascript
// 移除 ID 为 'my-div' 的元素
$('#my-div').remove()


4. 修改元素属性

使用 .attr() 函数可以修改元素的属性值。

javascript
// 将 ID 为 'my-link' 的 a 元素的 href 属性修改为 'https://www.google.com'
$('#my-link').attr('href', 'https://www.google.com')


5. 修改元素文本

使用 .text() 函数可以修改元素的文本内容。

javascript
// 将 ID 为 'my-heading' 的 h1 元素的文本内容修改为 'Hello world!'
$('#my-heading').text('Hello world!')


6. 修改元素样式

使用 .css() 函数可以修改元素的 CSS 样式。

javascript
// 将 ID 为 'my-div' 的元素的背景颜色修改为红色
$('#my-div').css('background-color', 'red')