a元素是內聯元素,為什么會獨占一行?
<div class="div">
? ? ? ? ? ? <a>:first-child</a>
? ? ? ? ? ? <a>第二個元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div> ?
看結果頁,【:first-child】后還有空位置呀,為什么【第二個元素】這句話直接到第二行去了呢
全部代碼:
<!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>第二個元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div> ?
? ? ? ? <div class="div">
? ? ? ? ? ? <a>:first-child</a>
? ? ? ? ? ? <a>第二個元素</a>
? ? ? ? ? ? <a>:last-child</a>
? ? ? ? </div>
? ? </div>
? ??
? ? <h4>顯示通過html方法獲取到的內容</h4>
? ? <p></p>
? ? <h4>顯示通過text方法獲取到的內容</h4>
? ? <p></p>
? ??
? ??
? ? <script type="text/javascript">
? ? ? ? //通過.text()的回調,獲取原本的內容,修改,在重新賦值
? ? ? ? $(".left a:first").text(function(idnex,text){
? ? ? ? ? ? return "增加新的文本內容" + text
? ? ? ? })
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //顯示出html方法獲取到的內容
? ? ? ? //.html()是整個html文檔結構
? ? ? ? $('p:first').html( $(".first-div").html() )?
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //顯示出text方法獲取到的內容
? ? ? ? //.text()是文本內容的合集
? ? ? ? $('p:last').text( $(".first-div").text() )?
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //通過.text()方法替換文本內容
? ? ? ? $(".left a:first").?('替換第一個a元素的內容')
? ? </script>
? ? <script type="text/javascript">
? ? ? ? //通過.html()方法替換html結構
? ? ? ? $(".left div:first").?('整個div的子節點都被替換了')
? ? </script>
</body>
</html>
2017-02-06
鏈接了一個.css文件 ?a{display:block}
2017-02-06
2017-02-06
這段代碼并不會跳行 你把所有代碼發上來