a元素是內(nèi)聯(lián)元素,為什么會(huì)獨(dú)占一行?
<div class="div">
? ? ? ? ? ? <a>:first-child</a>
? ? ? ? ? ? <a>第二個(gè)元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div> ?
看結(jié)果頁(yè),【:first-child】后還有空位置呀,為什么【第二個(gè)元素】這句話(huà)直接到第二行去了呢
全部代碼:
<!DOCTYPE html>
<html>
<head>
? ? <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
? ? <title></title>
? ? <link rel="stylesheet" href="imooc.css" type="text/css">
? ? <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
? ? <h3>.html()與.text()</h3>
? ? <div class="left first-div">
? ? ? ? <div class="div">
? ? ? ? ? ? <a>:first-child</a>
? ? ? ? ? ? <a>第二個(gè)元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div> ?
? ? ? ? <div class="div">
? ? ? ? ? ? <a>:first-child</a>
? ? ? ? ? ? <a>第二個(gè)元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div>
? ? </div>
? ??
? ? <h4>顯示通過(guò)html方法獲取到的內(nèi)容</h4>
? ? <p></p>
? ? <h4>顯示通過(guò)text方法獲取到的內(nèi)容</h4>
? ? <p></p>
? ??
? ??
? ? <script type="text/javascript">
? ? ? ? //通過(guò).text()的回調(diào),獲取原本的內(nèi)容,修改,在重新賦值
? ? ? ? $(".left a:first").text(function(idnex,text){
? ? ? ? ? ? return "增加新的文本內(nèi)容" + text
? ? ? ? })
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //顯示出html方法獲取到的內(nèi)容
? ? ? ? //.html()是整個(gè)html文檔結(jié)構(gòu)
? ? ? ? $('p:first').html( $(".first-div").html() )?
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //顯示出text方法獲取到的內(nèi)容
? ? ? ? //.text()是文本內(nèi)容的合集
? ? ? ? $('p:last').text( $(".first-div").text() )?
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //通過(guò).text()方法替換文本內(nèi)容
? ? ? ? $(".left a:first").?('替換第一個(gè)a元素的內(nèi)容')
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //通過(guò).html()方法替換html結(jié)構(gòu)
? ? ? ? $(".left div:first").?('整個(gè)div的子節(jié)點(diǎn)都被替換了')
? ? </script>
</body>
</html>
2017-02-06
鏈接了一個(gè).css文件 ?a{display:block}
2017-02-06
2017-02-06
這段代碼并不會(huì)跳行 你把所有代碼發(fā)上來(lái)