jQuery-HTML元素

作者：@kuaiquxie
作者的github：https://github.com/bitebita
本文为作者原创，如需转载，请注明出处：https://www.cnblogs.com/dzwj/p/15875716.html

设置文本

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<h1>设置文本内容</h1>

<h2 id="01">Hello China!</h2>
<h2 id="02">Hello World!</h2>

<script>
$(document).ready(function() {
  var myElement = $("#02");
  myElement.text("Hello Shanghai!");
});
</script>

</body>
</html>

获取文本元素

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<h1>获取文本内容</h1>

<h2 id="01">Hello World!</h2>
<h2 id="02">Hello China!</h2>
<h2 id="03">Hello Shanghai!</h2>

<p id="demo"></p>

<script>
$(document).ready(function() {
  var myElement = $("#03");
  var myText = myElement.text();
  $("#demo").text(myText); 
});
</script>

</body>
</html>

设置HTML内容

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>

</head>
<body>

<h1>设置 HTML</h1>

<div id="01">
  <h2>Hello China!</h2>
</div>
<div id="02">
  <h2>Hello World!</h2>
</div>

<p id="demo"></p>

<script>
$(document).ready(function() {
  var myElement = $("#02");
  myElement.html("<h2>Hello Shanghai!</h2>");
});
</script>

</body>
</html>

获取HTML内容

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<h1>设置 HTML</h1>

<div id="01">
  <h2>Hello China!</h2>
</div>
<div id="02">
  <h2>Hello World!</h2>
</div>

<script>
$(document).ready(function() {
  var content = $("#01").html();
  $("#02").html(content);
});
</script>

</body>
</html>