Copy isi DIV dengan jQuery


jquery_logo

Jika isi yang ada didalam div akan di tampilkan berulang kali, lebih baik kita duplikat saja isinya dengan jQuery, yah itung-itung mengurangi beberapa baris kode dan bisa juga untuk mengurangi waktu ‘load’ website.

Misalnya :

<div>isi div terdapat banyak baris kode</div>

kemudian div tersebut akan digunakan kembali secara berulang kali, sebelumnya akan seperti ini

<div>isi div terdapat banyak baris kode</div>

<div>isi div terdapat banyak baris kode</div>

<div>isi div terdapat banyak baris kode</div>

Kemudian kita bisa menyingkatnya sehingga menjadi seperti dibawah ini:

<div id=”copyDiv”>isi div terdapat banyak baris kode</div>

<div id=”duplikat1″></div>

<div id=”duplikat2″></div>

 

Contoh Script nya :

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.3.min.js'></script>
</head>
<body>
	<script type="text/javascript">
		window.onload=$(document).ready(function () {
		    $("#duplikat1").html($("#copyDiv").html());
		    $("#duplikat2").html($("#copyDiv").html());
		});
	</script>
	<div id="copyDiv">
	    <p><b>Ini</b> <i>adalah</i> <span style="color:green">isi Div yang akan di duplikat</span></p>
	    <!-- script by herupurwito.wordpress.com -->
	</div>
	    
	<div id="duplikat1"></div>
	<div id="duplikat2"></div>
</body>
</html>

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s