أحدث البرامج التعليمية وتطوير الشبكة
 

المراجع W3Data


كامل W3Data مرجع API

وظيفة وصف
w3DisplayData يعرض البيانات في HTML
w3IncludeHTML يعرض HTML في HTML
w3Http يقرأ البيانات من الخادم

W3Data كاملة السمة المرجعي

السمة وصف
{{}} وتعرف أين لعرض البيانات
W3-تكرار وتعرف أين تكرار البيانات
W3-تشمل-HTML وتعرف أين تشمل HTML

أمثلة

w3DisplayData

<!DOCTYPE html>
<html>
<script src="http://www.w3ii.com/lib/w3data.js"></script>
<body>

<div id="id01">
{{firstName}} {{lastName}}
</div>

<script>
w3DisplayData("id01", {"firstName" : "John", "lastName" : "Doe"});
</script>

</body>
</html> 
انها محاولة لنفسك »

w3Http

<!DOCTYPE html>
<html>
<link rel="stylesheet" href="http://www.w3ii.com/lib/w3.css">
<script src="http://www.w3ii.com/lib/w3data.js"></script>
<body>

<table id="id01" class="w3-table w3-bordered w3-striped">
  <tr>
    <th>Customer</th>
    <th>City</th>
    <th>Country</th>
  </tr>
  <tr w3-repeat="customers">
    <td>{{CustomerName}}</td>
    <td>{{City}}</td>
    <td>{{Country}}</td>
  </tr>
</table>

<script>
w3Http("customers.php", function () {
  if (this.readyState == 4 && this.status == 200) {
    var myObject = JSON.parse(this.responseText);
    w3DisplayData("id01", myObject);
  }
});
</script>

</body>
</html> 
انها محاولة لنفسك »

w3IncludeHTML

<!DOCTYPE html>
<html>
<script src="http://www.w3ii.com/lib/w3data.js"></script>
<body>

<div w3-include-HTML="h1.html"></div>
<div w3-include-HTML="content.html"></div>

<script>
w3IncludeHTML();
</script>

</body>
<html>
انها محاولة لنفسك »