Jquery--end()使用的问题

cfd406635982 2012-09-14 11:12:20



<!DOCTYPE html> 

<html> 

<head> 

  <style> 

  .test{color:red;}

  </style> 

  <script src="http://code.jquery.com/jquery-latest.js"></script> 

</head> 

<body> 

 

  <div id="first"></div>

  <div></div>

  <div></div>

  <div></div>

  

<script> 

$("<p>Hello world!</P>").appendTo("div").end().addClass("test");

</script> 

 

</body> 

</html>

这儿为什么是第一个DIV的字体是红色的？
明白的能给我详细的分析一下不？谢谢了哈。

...全文

144 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

cfd406635982 2012-09-17

打赏
举报

谢谢大家了。
我原来没有理解的是问题是这样的：



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>H</title>

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

</head>

<body>



<div></div>

<div></div>

<div></div>



<script type="text/javascript">

$(function(){

	var p = $("<P>my-jquery</P>");

	p.appendTo($("div"));

	p.html("Hello world");

});

</script>

</body>

</html>

执行以后这三个div的内容是：
Hello world
my-jquery
my-jquery

应该是在appendTo方法执行的时候，只有第一个div里面存放的是p对象，
后面的div里面都是p的副本，所以只有第一个改变了。结贴了。。

cfd406635982 2012-09-14

打赏
举报

[Quote=引用 1 楼的回复:]
$("Hello world!")//这是jquery申明元素的另一种方法
.appendTo("div")//附加到div尾
.end()//回到上一次操作之前，也就是将操作对像又指回了Hello world!
.addClass("test");//给它添加一个test样式

效果就是，给所有的div内加上Hello world!
并在第一……
[/Quote]
.end()//回到上一次操作之前，也就是将操作对像又指回了Hello world!
那这儿为什么是知道的是第一个Hello world!，为什么上次操作的是第一个呢？
而不是所有的p标签呢？我就是这个地方想不通。。

泡泡鱼_ 2012-09-14

打赏
举报

$("Hello world!")//这是jquery申明元素的另一种方法
.appendTo("div")//附加到div尾
.end()//回到上一次操作之前，也就是将操作对像又指回了Hello world!
.addClass("test");//给它添加一个test样式

效果就是，给所有的div内加上Hello world!
并在第一个Hello world!附加样式：Hello world!

泡泡鱼_ 2012-09-14

打赏
举报

[Quote=引用 2 楼的回复:]
引用 1 楼的回复:
$("Hello world!")//这是jquery申明元素的另一种方法
.appendTo("div")//附加到div尾
.end()//回到上一次操作之前，也就是将操作对像又指回了Hello world!
.addClass("test");//给它添加一个test样式

效果就是，给所有的div内加上Hello wor……
[/Quote]

.appendTo("div")时就已经给所有的div增加了之前定义的元素对象

.end()返回上一次的选择对象，记住，是对象本身，也就是$("<p>Hello world!</P>")

.addClass("test");//给它添加一个test样式

你说的那种效果应该这样子：



$("<p>Hello world!</P>").addClass("test").appendTo("div");

因为是先给元素对象$("Hello world!")附加了样式，再将其追加到div内，所以，每个div里的p都会有这个标签

呃，我可能说得不太清楚。拿你的这个举个例子吧，为了让你看得更明白，我变更了你的DOM结构

  <div id="first">

  <div></div>

  <div></div>

  <div></div>

</div>

  

<script> 

$("<p>Hello world!</P>").appendTo($("#first div")).end().addClass("test");

alert($('#first').html);//这是你之前的例子，你可以看看打印出来的是什么

$("#first div p").remove();//然后我们移除这前追加进来的p元素



var _p=$("<p>Hello world!</P>");//然后我们用另一种方法来达到效果

_p.appendTo($("#first div"));//一样的，追加进div内

_p.addClass("test");//给_p附加样式

alert($('#first').html);//再打印，跟之前的是一样的

</script>

chen_zujun 2012-09-14

打赏
举报

[Quote=引用 2 楼的回复:]

引用 1 楼的回复:
$("Hello world!")//这是jquery申明元素的另一种方法
.appendTo("div")//附加到div尾
.end()//回到上一次操作之前，也就是将操作对像又指回了Hello world!
.addClass("test");//给它添加一个test样式

效果就是，给所有的div内加上Hello w……
[/Quote]
实践测试一下你的想法

wwperfect 2012-09-14