jquery 节点
jQuery 节点操作
jQuery 提供了丰富的 DOM 节点操作方法，可以高效地查询、创建、修改和删除 HTML 元素。
选择节点
使用 jQuery 选择器可以快速定位 DOM 节点：
// 通过 ID 选择
$('#elementId')
// 通过类名选择
$('.className')
// 通过标签名选择
$('div')
// 复合选择器
$('ul li.active')创建节点
直接传入 HTML 字符串即可创建新节点：
// 创建新元素
var newDiv = $('<div>新创建的div</div>')
// 创建带属性的元素
var newImg = $('<img>', {
src: 'image.jpg',
alt: '示例图片',
class: 'thumbnail'
})插入节点
jQuery 提供了多种插入节点的方法：
// 在元素内部末尾插入
$('#container').append(newDiv)
// 在元素内部开头插入
$('#container').prepend(newDiv)
// 在元素外部之后插入
$('#target').after(newDiv)
// 在元素外部之前插入
$('#target').before(newDiv)修改节点
可以方便地修改节点内容和属性：
// 修改文本内容
$('#element').text('新文本内容')
// 修改 HTML 内容
$('#element').html('<strong>加粗文本</strong>')
// 修改属性
$('#image').attr('src', 'new-image.jpg')
// 修改 CSS
$('#element').css('color', 'red')删除节点
移除 DOM 节点的几种方式：
// 移除元素及其子元素
$('#element').remove()
// 只移除子元素
$('#container').empty()
// 分离元素（保留数据和事件）
$('#element').detach()遍历节点
jQuery 提供了节点遍历方法：
// 查找子元素
$('#parent').children()
// 查找父元素
$('#child').parent()
// 查找同级元素
$('#item').siblings()
// 查找特定条件的元素
$('li').filter('.active')节点属性操作
获取和设置节点属性的方法：
// 获取属性
var src = $('#image').attr('src')
// 设置属性
$('#image').attr({
'src': 'new.jpg',
'alt': '新图片'
})
// 删除属性
$('#image').removeAttr('alt')事件处理
为节点绑定事件处理程序：
// 点击事件
$('#button').click(function() {
alert('按钮被点击')
})
// 动态绑定（适用于未来添加的元素）
$('#container').on('click', '.item', function() {
console.log('项目被点击')
})
