2018.3.23课堂笔记

基本选择器(单个符号子母组成的):

#id                                                    根据给定的ID匹配一个元素

.class                                                 根据给定的类名匹配元素

element                                            根据给定元素名匹配元素

*                                                         匹配所有元素

selector1,selector2,selector3          将每一个选择器匹配到的元素合并返回

层次选择器($+(‘。。’)):
$('a d')                                               选取a元素里所有的d后代元素
$('p>c')                                             选取p元素下的c子元素
$('prev+next')                                  选取紧邻在prev元素后的next元素
$('prev~siblings')                             选取prev元素之后的所有siblings兄弟元素

过滤选择器:

:或者[    ]带上一个元素

查找元素节点

  var $li = $('ul li:eq(1)');
  var li_txt = $li.text();
  alert(li_txt);

查找属性节点

	var $para = $('p');
	var p_text = $para.attr('title');                     attr = getAttribute
	alert(p_text);

创建元素节点

 var $li_1 = $('<li>1</li>');
	var $li_2 = $('<li>2</li>');
	$('ul').append($li_1);                             creatElement
	$('ul').append($li_2);

创建属性节点

var $li_1 = $('<li title="香蕉">香蕉</li>');
	var $li_2 = $('<li title="雪梨">雪梨</li>');
	$('ul').append($li_1);
	$('ul').append($li_2);

插入节点的方法

append()                            向每个元素内部追加内容
appendTo()                   将所有匹配的元素追加指定的元素中
prepend()                           向每个匹配的元素内部前置内容
prependTo()                   将所有匹配的元素前置到指定元素中
after()                          在每个匹配的元素之后插入内容
insertAfter()                 将所有匹配的元素插入到指定元素的后面
before()                         在每个匹配的元素之前插入内容

insertBefore()                 将所有匹配的元素插入到指定元素的前面

删除节点的方法

1.remove()方法                 返回值是被删除节点的引用

2.detach()方法                 同样是从DOM中去掉所有匹配的元素,但不会把匹配的元素从jQuery对象中删除,因而可以在将                                            来再使用这些匹配的元素。

3.empty()方法               empty()方法并不是删除节点,而是清空节点,它能清空元素中所有后代节点。

1.复制节点
$('ul li').click(function(){
$(this).clone(true).appendTo('ul');

});


2.替换节点
$('p').replaceWith('<strong>你最不喜欢的水果是?</strong>');

$('<strong>你最不喜欢的水果是?</strong>').replaceAll('p');








猜你喜欢

转载自blog.csdn.net/readygoing/article/details/79686272
今日推荐