服务器与html的数据传递 第一个想到的是用xml 利用里面的父节点 来进行索引。后来老板推荐使用了json,对于json第一反应就是便捷,写代码不需要像xml有那么多的重复代码。
学习json用于服务器与html的数据传输 jquery里面有个getJSON()方法可以获取
如何将它们综合起来运用html +javascript+jquery
感觉还是边做边实际做东西效果明显些
这个好像还是比较高级的
学习 AJAX
参考网址如下:
http://www.w3school.com.cn/ajax/index.asp
通过AJAX改变内容 感觉用jquery的text内容就可以做
例子如下 参考网址的AJAX实例 就是文本内如何换行还没想到如何做
js代码
$(document).ready(function loadXMLDoc(){ $("#cbtn").click(function(){ $("#myDiv").text("AJAX is not a programming language." + "It is just a technique for creating better and more interactive web applications."); }); });html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="../../jquery-3.1.0.min.js"></script> <script src="ajax.js"></script> </head> <body> <div id="myDiv"><h3>Let AJAX change this text</h3></div> <button id="cbtn" type="button" οnclick="loadXMLDoc()">Change Content</button> </body> </html>
现在利用AJAX来实现功能呢
创建一个test.txt
AJAX is not a programming language It is just a technique for creating better and more interactive web applications再创建一个ajax.js$(document).ready(function(){ $("button").click(function(){ $.ajax({url:"test.txt",success:function(result){ $("#myDiv").html(result);$("#p2").before("hello"); }}); }); });建立一个html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="../../jquery-3.1.0.min.js"></script> <script src="ajax.js"></script> </head> <body> <div id="myDiv"><h3>Let AJAX change this text</h3></div> <button id="cbtn" type="button" >Change Content</button> </body> </html>
两种方式实现那个例子 利用ajax是比较方便,txt里面可以写很多数据