JS&jQueryプレミアム05(htmlにappendで要素を挿入)
4188 ワード
目的:JSでhtmlにコンテンツを追加する.
どのように1を実現して、JSの中で要素を作成します;2、htmlに要素を挿入します.
例:
実際の効果は次のとおりです.
どのように1を実現して、JSの中で要素を作成します;2、htmlに要素を挿入します.
例:
<html>
<head>
<meta charset="utf-8">
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">script>
head>
<body>
<div style="width: 100%;text-align: center;margin-top: 50px;">
<h1> h1>
div>
<hr>
<div style="width: 100%;text-align: center;">
<h3 style="color: grey;"> h3>
div>
<div id="all_teas">
div>
<script type="text/javascript">
$(document).ready(function(){
// :
var html='hi
:20
'
// append html id “all_teas” 。
$('#all_teas').append(html);
script>
body>
html>
実際の効果は次のとおりです.
<div id="all_teas">
<div style="width: 333px;height:300px;float: left;text-align: center;margin-top: 10px 0;"><h1 style="margin:0;">hih1><p> :20 p>div> div>