In this SharePoint client-side object model tutorial, I am going to explain how to retrieve SharePoint list items programmatically using jsom (javascript object model), Rest API, and CSOM (C#.Net managed client object model) in SharePoint Online.
Here, I have a SharePoint Online list named as “Industries,” which has a Title column and has few items inserted into the list, which looks like below:

Here, I will show you how you can retrieve SharePoint list items programmatically using csom, jsom, and rest api and display them as hyperlinks inside a Script editor web part in a SharePoint web part page.
Get SharePoint List Items using JavaScript
Now we will see how to get list items using jsom (JavaScript object model) in SharePoint 2013/2016/2019 or SharePoint Online.
Below is code you can add inside a script editor web part.
<p style="font-size:25px;" width="500px;">Industries (JSOM):</p>
<hr>
<p id="industries" style="font-size:15px;" width="500px;"></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function () {
ExecuteOrDelayUntilScriptLoaded(getIndustriesJSOM, "sp.js");
});
var colltaskListItem;
function getIndustriesJSOM()
{
var clientContext = new SP.ClientContext.get_current();
var oList = clientContext.get_web().get_lists().getByTitle('Industries');
var camlQuery = new SP.CamlQuery();
colltaskListItem = oList.getItems(camlQuery);
clientContext.load(colltaskListItem);
clientContext.executeQueryAsync(onSuccess, onFailure);
}
function onSuccess()
{
var allIndustries='';
var listItemEnumerator = colltaskListItem.getEnumerator();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
var url=_spPageContextInfo.webAbsoluteUrl +"/Lists/Industries/DispForm.aspx?ID="+oListItem.get_item('ID');
allIndustries+= "<a href='" + url + "'>" + oListItem.get_item('Title') + "</a>" + "<br />";
}
$("#industries").html(allIndustries);
}
function onFailure()
{
alert('Some error occurred');
}
</script>
Once you run the jsom SharePoint code, you can see it will display the list items like below:

Get SharePoint list items using rest api
Now I will show you how to get sharepoint list items using rest api in SharePoint 2013/2016 or SharePoint Online. We will retrieve items from the same SharePoint online list.
Below SharePoint rest api code, you can insert inside a script editor web part in SharePoint Online web part page.
<p style="font-size:25px;" width="500px;">Industries (Rest API):</p>
<hr>
<p id="industries" style="font-size:15px;" width="500px;"></p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getByTitle('Industries')/items";
$.ajax({
url: requestUri,
type: "GET",
headers: {
"accept":"application/json; odata=verbose"
},
success: onSuccess,
error: onError
});
function onSuccess(data) {
var allitems='';
var items = data.d.results;
for (var i = 0; i < items.length; i++) {
var url=_spPageContextInfo.webAbsoluteUrl +"/Lists/Industries/DispForm.aspx?ID="+items[i].ID;
allitems+= "<a href='" + url + "'>" + items[i].Title + "</a>" + "<br>";
}
document.getElementById("industries").innerHTML = allitems;
}
function onError(error) {
alert(JSON.stringify(error));
}
</script>
Once you run the code, it will retrieve sharepoint list items programmatically using jsom in SharePoint online and display in a hyperlink.

Get SharePoint list items using CSOM
Now we will see how we can retrieve list items using csom SharePoint online or SharePoint 2016/2013. Here I have created an asp.net web application and used c#.net managed object model code by using below dlls:
- Microsoft.SharePoint.Client.dll
- Microsoft.SharePoint.Client.Runtime.dll
You can create an Asp.net web application, windows or console application, or you can use Provider hosted Add-in SharePoint Online to work with C#.Net managed object model code.
Here, I have used a Literal asp.net control to display all list items as a hyperlink.
.Aspx Code:
<div class="jumbotron">
<h2>SharePoint .Net Client Object Model (csom)</h2>
</div>
<div class="row">
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</div>
.cs Code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Security;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.SharePoint.Client;
using ListItem = Microsoft.SharePoint.Client.ListItem;
using ListItemCollection = Microsoft.SharePoint.Client.ListItemCollection;
namespace ClientDemoSharePointOnline
{
public partial class _Default : Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindListItems();
}
}
void BindListItems()
{
using (ClientContext ctx = new ClientContext("https://onlysharepoint2013.sharepoint.com/sites/Rohit/"))
{
ctx.AuthenticationMode = ClientAuthenticationMode.Default;
ctx.Credentials = new SharePointOnlineCredentials("bijay@onlysharepoint2013.onmicrosoft.com", GetSPOSecureStringPassword());
List lstIndustries = ctx.Web.Lists.GetByTitle("Industries");
CamlQuery query = CamlQuery.CreateAllItemsQuery(100);
ListItemCollection items = lstIndustries.GetItems(query);
ctx.Load(items);
ctx.ExecuteQuery();
string fullItems = string.Empty;
foreach (ListItem listItem in items)
{
string url= "https://onlysharepoint2013.sharepoint.com/sites/Rohit/Lists/Industries/" + listItem["ID"].ToString();
fullItems += "<a href='" + url + "'>" + listItem["Title"].ToString() + "</a>" + "<br>";
}
Literal1.Text = fullItems;
}
}
private static SecureString GetSPOSecureStringPassword()
{
try
{
var secureString = new SecureString();
foreach (char c in "GiveYourPasswordHere")
{
secureString.AppendChar(c);
}
return secureString;
}
catch
{
throw;
}
}
}
}
Once you run the code, you can see it will get SharePoint list items programmatically using csom in SharePoint.

Conclusion
In this SharePoint client object model tutorial, we discussed retrieving SharePoint list items programmatically using the JavaScript object model (jsom), getting all SharePoint items using Rest API, and getting list items using csom SharePoint online.
You may also like:
- SharePoint Server relative urls must start with SPWeb.ServerRelativeUrl csom
- The file is not checked out. You must first check out this document before making changes in SharePoint.
- Display SharePoint list data using HTML and jQuery table using Rest API
I am Bijay a Microsoft MVP (10 times – My MVP Profile) in SharePoint and have more than 17 years of expertise in SharePoint Online Office 365, SharePoint subscription edition, and SharePoint 2019/2016/2013. Currently working in my own venture TSInfo Technologies a SharePoint development, consulting, and training company. I also run the popular SharePoint website EnjoySharePoint.com