老司機(jī)來解答一下，2個(gè)問題，問題在底層
<!DOCTYPE html>
<html>
<head>
? ? <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
? ? <title></title>
? ? <style>
? ? .left {
? ? ? ? width: auto;
? ? ? ? height: 150px;
? ? }
? ??
? ? .left div {
? ? ? ? width: 150px;
? ? ? ? height: 120px;
? ? ? ? padding: 5px;
? ? ? ? margin: 5px;
? ? ? ? float: left;
? ? ? ? background: #bbffaa;
? ? ? ? border: 1px solid #ccc;
? ? }
? ? </style>
? ? <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
? ? <h2>add方法()</h2>
? ? <div class="left first-div">
? ? ? ? <div class="div">
? ? ? ? ? ? <ul>
? ? ? ? ? ? ? ? <li>list item 1</li>
? ? ? ? ? ? ? ? <li>list item 2</li>
? ? ? ? ? ? ? ? <li>list item 3</li>
? ? ? ? ? ? </ul>
? ? ? ? ? ? <p>新的p元素</p>
? ? ? ? </div>
? ? </div>
? ? <div class="right"></div>
? ? <br/>
? ? <button>點(diǎn)擊：add傳遞元素標(biāo)簽</button>
? ? <button>點(diǎn)擊：add傳遞html結(jié)構(gòu)</button>
? ? <script type="text/javascript">
? ? $("button:first").click(function() {
? ? ? ? ?//把p元素添加到li的合集中
? ? ? ? ?$('li').add('p').css('background', 'red')
? ? })
? ? </script>
? ? <script type="text/javascript">
? ? $("button:last").click(function() {
? ? ? ? ?//把html結(jié)構(gòu)'<p>新的p元素</p>'
? ? ? ? ?//加入到li的合集中，為了能夠在頁(yè)面上顯示
? ? ? ? ?//需要再重新appendTo到指定的節(jié)點(diǎn)處
? ? ? ? ?//值得注意：整個(gè)結(jié)構(gòu)位置都改變了
? ? ? ? ?$('li').add('<p>新的p元素</p>').appendTo($('.right'))
? ? })
? ? </script>
</body>
</html>
添加的位置在div ?class=“right”這個(gè)標(biāo)簽上，前面css代碼并沒有給right標(biāo)簽設(shè)置樣式，這里為什么默認(rèn)的是綠色的背景呢？
動(dòng)態(tài)創(chuàng)建了p標(biāo)簽加入到“l(fā)i”這個(gè)合集中，為什么顯示器上只有動(dòng)態(tài)創(chuàng)建的標(biāo)簽而沒有l(wèi)i標(biāo)簽?zāi)兀?br />
2017-12-02
樓上正解，其實(shí)樓主的疑惑，你可以按下F12打開調(diào)試工具，看看究竟出現(xiàn)了什么變化，同時(shí)，建議您復(fù)習(xí)一下之前JQ的appendTo()的規(guī)則，你就知道大概什么為什么會(huì)是這個(gè)結(jié)果了。
2017-09-13
1、前面css代碼沒有給<div class="right"></div>設(shè)置樣式，該div沒有默認(rèn)綠色的背景。綠色背景的div是<div class="left"></left>。
2、add()方法不是直接對(duì)html操作。
$('li').add('<p>新的元素</p>')的結(jié)果是產(chǎn)生新集合：
[<li>...</li>,<li>...</li>,...,<li>...</li>,<p>新的元素</p>]。
這個(gè)時(shí)候沒有appendTo()方法，所以p元素不會(huì)顯示在html中。
用appendTo()方法，上面新集合里的dom對(duì)象會(huì)按照appendTo()的規(guī)則加到?<div?class="right"></div>里。