读取 SharePoint 列表，并通过 JavaScript 函数将数据放在 HTML 文件中 [英] Read a SharePoint List and put the data on a HTML file through JavaScript function
问题描述
我有一个 SharePoint URL，它只是一个包含一些列和行数据的 SharePoint 列表.
I have a SharePoint URL which is just a SharePoint list with some columns and rows of data.
我想从该特定 URL 中读取该信息，并通过 JavaScript 函数将数据放在 HTML 文件中.
I will like to read that information from that specific URL and put the data on a HTML file through a JavaScript function.
我对 JavaScript & 没有任何经验HTML5 完全如此，我不知道如何调用这些函数来检索数据.
I have no experience about JavaScript & HTML5 at all so, I am not sure how to call to those functions in order to retrieve the data.
到目前为止，这就是我所拥有的，但它根本不起作用:
That's what I have so far and it is not working at all:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
</head>
<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$().SPServices({
operation: "GetListItems",
webURL: "http://myURL.aspx",
async: false,
listName: "Announcements",
CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>",
completefunc: function (xData, Status) {
$(xData.responseXML).SPFilterNode("z:row").each(function() {
var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>";
$("#tasksUL").append(liHtml);
});
}
});
});
</script>
<ul id="tasksUL"/>
<body>
</body>
</html>
如果我尝试打开 index.html 没有任何反应，所以我不知道如何调用我的 HTML 文件中的函数.另外，我不知道如何在 HTML 文件中定义 SP.ClientContext.
If I try to open the index.html nothing happens so I don't know how to call to my functions on my HTML file. Also, I don't know how to define SP.ClientContext in the HTML file.
非常感谢.
推荐答案
SPServices 库将为你很容易.
您需要使用这个调用.我通常将它封装在我自己的函数中以使代码更漂亮，尤其是在我进行大量 AJAX 列表查询时.
You'll want to use this call. I usually encapsulate it in my own function to make the code prettier, especially if I'm making a lot of AJAX list queries.
基本上，SharePoint 将返回一个丑陋的 XML 文档，其中包含 Microsoft 文档.您将使用 SPServices 遍历此文档，如下所示:
Basically what will happen is SharePoint will return an ugly XML document that has all your list items as defined by the Microsoft Documentation. You'll traverse this document using SPServices like this:
<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function() {
$().SPServices({
operation: "GetListItems",
async: false,
listName: "Announcements",
CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>",
completefunc: function (xData, Status) {
$(xData.responseXML).SPFilterNode("z:row").each(function() {
var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>";
$("#tasksUL").append(liHtml);
});
}
});
});
</script>
<ul id="tasksUL"/>`
逐行:<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script>
SPServices 需要 JQuery<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script>
包括 SPServices$(document).ready(function() {
"加载DOM时，执行此函数"$().SPServices({
这是一个 SPServices 函数"操作:"GetListItems",
我们正在使用‘GetListItems’网络服务"异步:假，
不是异步的，现在就做"listName: "公告",
我们正在使用‘公告’列表"CAMLViewFields: "
不用担心这条线completefunc: function (xData, Status) {
"请求完成时运行此函数.数据作为xData传递，完成状态作为Status传递"$(xData.responseXML).SPFilterNode("z:row").each(function() {
获取响应字符串并仅获取行"XML 节点.对于这些节点中的每一个，运行此函数..."var liHtml = "
创建一个名为 liHtml 的变量，它等于 li 标记和 XML 属性 ows_Title"$("#tasksUL").append(liHtml);
"将此列表项附加到 ID 为 'tasksUL' 的元素中"
Line by line:
<script type="text/javascript" src="filelink/jquery-1.6.1.min.js"></script>
JQuery is required by SPServices
<script type="text/javascript" src="filelink/jquery.SPServices-0.6.2.min.js"></script>
Including SPServices
$(document).ready(function() {
"When the DOM is loaded, execute this function"
$().SPServices({
"This is an SPServices function"
operation: "GetListItems",
"We are using the 'GetListItems' web service"
async: false,
"Not asynchronous, do it now"
listName: "Announcements",
"We're using the list 'Announcements"
CAMLViewFields: "<ViewFields><FieldRef Name='Title' /></ViewFields>",
Don't worry about this line
completefunc: function (xData, Status) {
"Run this function when the request is complete. The data is passed as xData, the completion status is passed as Status"
$(xData.responseXML).SPFilterNode("z:row").each(function() {
"Take the response string and only take the "row" XML nodes. For each of these nodes, run this function..."
var liHtml = "<li>" + $(this).attr("ows_Title") + "</li>";
"Create a variable called liHtml equal to an li tag and the XML attribute ows_Title"
$("#tasksUL").append(liHtml);
"Append this list item to the element with an ID of 'tasksUL'"
这篇关于读取 SharePoint 列表，并通过 JavaScript 函数将数据放在 HTML 文件中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
