Skip to content

Instantly share code, notes, and snippets.

@amin007

amin007/api_jakim.xml

Last active July 9, 2017 16:14
Show Gist options
  • Save amin007/7b53d64bb42d94aa76cfee098e8f46e6 to your computer and use it in GitHub Desktop.
Save amin007/7b53d64bb42d94aa76cfee098e8f46e6 to your computer and use it in GitHub Desktop.
Download ZIP
contoh panggil xml dalam jquery
Raw
api_jakim.xml
<rss version="2.0"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
xmlns:admin="http://webns.net/mvcb/"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:content="http://purl.org/rss/1.0/modules/content/">
<channel>
<title>eSolat JAKIM : Waktu Solat Hari Ini</title>
<link>Batu Pahat, Muar, Segamat, Gemas</link>
<description>Batu Pahat, Muar, Segamat, Gemas</description>
<dc:language>ms</dc:language>
<dc:creator>www.e-solat.gov.my</dc:creator>
<dc:rights>Copyright JAKIM</dc:rights>
<dc:date>05-07-2017 11:12:14</dc:date>
<admin:generatorAgent rdf:resource="expressionengine" />
<item>
<title>Imsak</title>
<description>5:34</description>
</item>
<item>
<title>Subuh</title>
<description>5:44</description>
</item>
<item>
<title>Syuruk</title>
<description>7:07</description>
</item>
<item>
<title>Zohor</title>
<description>13:16</description>
</item>
<item>
<title>Asar</title>
<description>16:41</description>
</item>
<item>
<title>Maghrib</title>
<description>19:22</description>
</item>
<item>
<title>Isyak</title>
<description>20:37</description>
</item>
</channel>
</rss>
Raw
waktu_solat.html
<!DOCTYPE html>
<html><head>
<!-- META -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- PAGE TITLE -->
<title>Jadual Kuliah 4</title>
<!-- BOOTSTRAP CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- link rel="stylesheet" href="public/css/gambar_bertukar.css" -->
</head><body>
<!-- ############################################################################## -->
<nav class="navbar navbar-fixed-top" id="result"></nav>
<!-- #################################################################################################### -->
<script src="https://code.jquery.com/jquery-2.2.3.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//feed to parse
//var feed = "http://feeds.feedburner.com/raymondcamdensblog?format=xml";
var feed = 'api_jakim.xml';
$.ajax(feed, {
accepts:{ xml:'application/rss+xml' },
dataType:'xml',
success:function(data)
{
//Credit: http://stackoverflow.com/questions/10943544/how-to-parse-an-rss-feed-using-javascript
//https://dzone.com/articles/parsing-rss-feeds-in-javascript-options
//https://www.w3schools.com/xml/met_element_getelementsbytagname.asp
///////////////////////////////////////////////////////////////////////////////////////////
/*jQuery('#result').append(''
//+ '<a class="navbar-brand">' + feed.title + '</a>'
+ '<a class="navbar-brand">' + data.description + '</a>'
);*/
///////////////////////////////////////////////////////////////////////////////////////////
var html = '<div id="navbar" class="collapse navbar-collapse">'
+ '<ul class="nav navbar-nav">';
$(data).find("item").each(function ()
{ // or "item" or whatever suits your feed
var el = $(this);
html += '<li><a>'
+ el.find("title").text() + ' : '
+ el.find("description").text()
+ '</a></li>'
});
html += '</ul></div>';
jQuery('#result').append(html);
///////////////////////////////////////////////////////////////////////////////////////////
}});
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment