Completar operaciones básicas con código de biblioteca de JavaScript en SharePointComplete basic operations using JavaScript library code in SharePoint

Advertencia

Esta información sólo es válida cuando se usan experiencias clásicas de SharePoint en la versión online o local.This information is only valid when you use classic SharePoint experiences in SharePoint Online or in on-premises. El uso de modelo de objetos de cliente JavaScript clásico de SharePoint no es compatible con las experiencias modernas o con SharePoint Framework.Usage of classic SharePoint JavaScript Client Object Model is not supported with the modern experiences or with SharePoint Framework.

Puede usar el modelo de objetos de cliente de SharePoint para recuperar, actualizar y administrar datos en SharePoint.You can use the SharePoint client object model to retrieve, update, and manage data in SharePoint. SharePoint ofrece el modelo de objetos de varias formas:SharePoint makes the object model available in several forms:

  • Ensamblados redistribuibles de .NET Framework.NET Framework redistributable assemblies
  • Biblioteca de JavaScriptJavaScript library
  • Extremos REST/ODataREST/OData endpoints
  • Ensamblados de Windows PhoneWindows Phone assemblies
  • Ensamblados redistribuibles de SilverlightSilverlight redistributable assemblies

Para obtener más información sobre los conjuntos de API que están disponibles para SharePoint, vea Elegir el conjunto de API correcto en SharePoint.For more information about the sets of APIs that are available for SharePoint, see Choose the right API set in SharePoint.

Nota

Para ver un complemento de SharePoint de ejemplo del nivel "Hola a todos" que usa la biblioteca de JavaScript, vea Usar las API de JavaScript de SharePoint para trabajar con datos de SharePoint.For a "Hello World" level sample SharePoint Add-in that uses the JavaScript library, see Use the SharePoint JavaScript APIs to work with SharePoint data.

En este artículo se muestra cómo realizar operaciones básicas con el modelo de objetos de JavaScript.This article shows how to perform basic operations using the JavaScript object model. Puede agregarse un complemento hospedado en la nube mediante etiquetas HTML de <script>.You can add a reference to the object model by using HTML <script> tags. Para obtener información sobre cómo usar las demás API de cliente, vea lo siguiente:For information about how to use the other client APIs, see the following:

Realizar tareas básicas en SharePoint con el modelo de objetos de cliente de JavaScriptPerform basic tasks in SharePoint using the JavaScript client object model

En las secciones siguientes se describen las tareas que puede completar mediante programación, que incluyen ejemplos de código JavaScript para demostrar las operaciones.The following sections describe tasks that you can complete programmatically, and they include JavaScript code examples that demonstrate the operations.

Al crear un complemento hospedado en la nube, puede agregarse una referencia al modelo de objetos mediante etiquetas HTML de <script>.When you create a cloud-hosted add-in, you can add a reference to the object model by using HTML <script> tags. Se recomienda hacer referencia a la web de host, ya que es posible que la web de complemento no exista en todos los escenarios de complementos hospedados en la nube. Puede recuperar la dirección URL de la web de host del parámetro de cadena de consulta SPHostUrl si usa el token {StandardTokens}.We recommend that you reference the host web because the add-in web may not exist in every scenario in cloud-hosted add-ins. You can retrieve the host web URL from the SPHostUrl query string parameter if you are using the {StandardTokens} token. También puede usar el parámetro de consulta personalizado si usa el token {HostUrl}.You can also use your custom defined query string parameter if you are using the {HostUrl} token. Cuando tenga la dirección URL de la web de host, debe usar código JavaScript para crear dinámicamente la referencia al modelo de objetos.After you have the host web URL, you must use JavaScript code to dynamically create the reference to the object model.

En el ejemplo de código siguiente se ejecutan estas tareas para agregar una referencia al modelo de objetos de JavaScript:The following code example performs these tasks to add a reference to the JavaScript object model:

  • Hace referencia a la biblioteca AJAX desde la Red de entrega de contenido (CDN) de Microsoft.References the AJAX library from the Microsoft Content Delivery Network (CDN).
  • Hace referencia a la biblioteca jQuery desde la CDN de Microsoft.References the jQuery library from the Microsoft CDN.
  • Extrae la dirección URL de la web de host desde la cadena de consulta.Extracts the host web URL from the query string.
  • Sube los archivos SP.Runtime.js y SP.js con la función getScript en jQuery. Después de subir los archivos, el programa tiene acceso al modelo de objetos JavaScript para SharePoint.Loads the SP.Runtime.js and SP.js files by using the getScript function in jQuery. After loading the files, your program has access to the JavaScript object model for SharePoint.
  • Continúa el flujo en la función execOperation.Continues the flow in the execOperation function.
<script 
    src="//ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js" 
    type="text/javascript">
</script>
<script
    type="text/javascript"
    src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js">
</script>
<script type="text/javascript">
    var hostweburl;

    // Load the required SharePoint libraries.
    $(document).ready(function () {

        // Get the URI decoded URLs.
        hostweburl =
            decodeURIComponent(
                getQueryStringParameter("SPHostUrl")
        );

        // The js files are in a URL in the form:
        // web_url/_layouts/15/resource_file
        var scriptbase = hostweburl + "/_layouts/15/";

        // Load the js files and continue to
        // the execOperation function.
        $.getScript(scriptbase + "SP.Runtime.js",
            function () {
                $.getScript(scriptbase + "SP.js", execOperation);
            }
        );
    });

    // Function to execute basic operations.
    function execOperation() {

        // Continue your program flow here.

    }

    // Function to retrieve a query string value.
    // For production purposes you may want to use
    // a library to handle the query string.
    function getQueryStringParameter(paramToRetrieve) {
        var params =
            document.URL.split("?")[1].split("&amp;");
        var strParams = "";
        for (var i = 0; i < params.length; i = i + 1) {
            var singleParam = params[i].split("=");
            if (singleParam[0] == paramToRetrieve)
                return singleParam[1];
        }
    }
</script>


Al crear un complemento hospedado en SharePoint, puede agregar una referencia al modelo de objetos con etiquetas <script> de HTML. La web de complemento de un complemento hospedado en SharePoint le permite usar rutas de acceso relativas para hacer referencia a los archivos necesarios para usar el modelo de objetos JavaScript:When you create a SharePoint-hosted add-in, you can add a reference to the object model by using HTML <script> tags. The add-in web in a SharePoint-hosted add-in allows you to use relative paths to reference the required files to use the JavaScript object model.

El marcado siguiente ejecuta estas tareas para agregar una referencia al modelo de objetos de JavaScript:The following markup performs these tasks to add a reference to the JavaScript object model:

  • Hace referencia a la biblioteca AJAX desde la CDN de Microsoft.References the AJAX library from the Microsoft CDN.
  • Hace referencia al archivo SP.Runtime.js con una dirección URL relativa a la web de complemento.References the SP.Runtime.js file by using a URL relative to the add-in web.
  • Hace referencia al archivo SP.js con una dirección URL relativa a la web de complemento.References the SP.js file by using a URL relative to the add-in web.
<script 
    src="//ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js" 
    type="text/javascript">
</script>
<script 
    type="text/javascript" 
    src="/_layouts/15/sp.runtime.js">
</script>
<script 
    type="text/javascript" 
    src="/_layouts/15/sp.js">
</script>
<script type="text/javascript">

    // Continue your program flow here.

</script>

Tareas de sitio web de SharePointSharePoint website tasks

Para trabajar con sitios web con JavaScript, empiece con el constructor ClientContext(serverRelativeUrl) y pase una dirección URL o URI para devolver un contexto de solicitud específico.To work with websites using JavaScript, start by using the ClientContext(serverRelativeUrl) constructor and pass a URL or URI to return a specific request context.

Recuperar las propiedades de un sitio webRetrieve the properties of a website

Use la propiedad web de la clase ClientContext para especificar las propiedades del objeto de sitio web que se encuentra en la dirección URL de contexto especificada.Use the web property of the ClientContext class to specify the properties of the website object that is located at the specified context URL. Después de cargar el objeto de sitio web mediante el método load(clientObject) y luego llamar a executeQueryAsync(succeededCallback, failedCallback), se adquiere acceso a todas las propiedades del sitio web.After you load the website object through the load(clientObject) method and then call executeQueryAsync(succeededCallback, failedCallback), you acquire access to all the properties of that website.

En el siguiente ejemplo se muestra el título y la descripción del sitio web especificado, aunque las demás propiedades que se devuelven de forma predeterminada pasan a estar disponibles después de cargar el objeto de sitio web y ejecutar la consulta.The following example displays the title and description of the specified website, although all other properties that are returned by default become available after you load the website object and execute the query.


function retrieveWebSite(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    this.oWebsite = clientContext.get_web();

    clientContext.load(this.oWebsite);

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded(sender, args) {
    alert('Title: ' + this.oWebsite.get_title() + 
        ' Description: ' + this.oWebsite.get_description());
}
    
function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Recuperar solo las propiedades seleccionadas de un sitio webRetrieve only selected properties of a website

Para reducir la transferencia de datos innecesaria entre cliente y servidor, es posible que desee devolver solo las propiedades especificadas del objeto de sitio web, en lugar de todas sus propiedades. En este caso, use la sintaxis de la expresión lambda o consulta LINQ con el método load(clientObject) para especificar las propiedades que se van a devolver desde el servidor. En el siguiente ejemplo, solo se ponen a disposición el título y la fecha de creación del objeto de sitio web después de llamar a executeQueryAsync(succeededCallback, failedCallback).To reduce unnecessary data transference between client and server, you might want to return only specified properties of the website object, not all of its properties. In this case, use LINQ query or lambda expression syntax with the load(clientObject) method to specify which properties to return from the server. In the following example, only the title and creation date of the website object become available after executeQueryAsync(succeededCallback, failedCallback) is called.

function retrieveWebSiteProperties(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    this.oWebsite = clientContext.get_web();

    clientContext.load(this.oWebsite, 'Title', 'Created');

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded(sender, args) {
    alert('Title: ' + this.oWebsite.get_title() + 
        ' Created: ' + this.oWebsite.get_created());
}
    
function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Nota

Si trata de obtener acceso a otras propiedades, el código produce una excepción porque las otras propiedades no están disponibles.If you try to access other properties, the code throws an exception because other properties are not available.


Escribir en las propiedades de un sitio webWrite to a website's properties

Para modificar un sitio web, se deben establecer las propiedades y llamar al método update(), de manera similar al modo en que funciona el modelo de objetos de servidor. Sin embargo, en el modelo de objetos de cliente, debe llamar a executeQueryAsync(succeededCallback, failedCallback) para solicitar el procesamiento por lotes para todos los comandos que se especifiquen. En el siguiente ejemplo se cambia el título y la descripción de un sitio web especificado.To modify a website, you set its properties and call the update() method, similarly to how the server object model functions. However, in the client object model, you must call executeQueryAsync(succeededCallback, failedCallback) to request batch processing of all commands that you specify. The following example changes the title and description of a specified website.

function updateWebSite(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    this.oWebsite = clientContext.get_web();

    this.oWebsite.set_title('Updated Web Site');
    this.oWebsite.set_description('This is an updated website.');
    this.oWebsite.update();

    clientContext.load(this.oWebsite, 'Title', 'Description');

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded(sender, args) {
    alert('Title: ' + this.oWebsite.get_title() + 
        ' Description: ' + this.oWebsite.get_description());
}
    
function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Tareas de lista de SharePointSharePoint list tasks

Trabajar con objetos de lista con JavaScript es parecido a trabajar con objetos de sitio web. Empiece por usar el constructor ClientContext(serverRelativeUrl) y pasar una dirección URL o URI para devolver un contexto de consulta específico. Después puede usar la propiedad lists de la clase Web para obtener la colección de listas del sitio web.Working with list objects using JavaScript is similar to working with website objects. Start by using the ClientContext(serverRelativeUrl) constructor and passing a URL or URI to return a specific request context. You can then use the lists property of the Web class to get the collection of lists in the website.

Recuperar todas las propiedades de todas las listas de un sitio webRetrieve all properties of all lists in a website

Para devolver todas las listas de un sitio web, cargue la colección de listas con el método load(clientObject) y luego llame a executeQueryAsync(succeededCallback, failedCallback). En el siguiente ejemplo se muestra la dirección URL del sitio web, y la fecha y hora, en que se creó la lista.To return all the lists of a website, load the list collection through the load(clientObject) method, and then call executeQueryAsync(succeededCallback, failedCallback). The following example displays the URL of the website and the date and time that the list was created.

function retrieveAllListProperties(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    this.collList = oWebsite.get_lists();
    clientContext.load(collList);

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var listInfo = '';
    var listEnumerator = collList.getEnumerator();

    while (listEnumerator.moveNext()) {
        var oList = listEnumerator.get_current();
        listInfo += 'Title: ' + oList.get_title() + ' Created: ' + 
            oList.get_created().toString() + '\n';
    }
    alert(listInfo);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Recuperar solo propiedades específicas de listasRetrieve only specified properties of lists

En el ejemplo anterior se devuelven todas las propiedades de las listas de un sitio web. Para reducir la transferencia de datos innecesarios entre cliente y servidor, puede usar expresiones de consultas LINQ para especificar qué propiedades devolver. En JavaScript, se especifica Include como parte de la cadena de la consulta que se pasa al método load(clientObject) para especificar qué propiedades devolver. En el siguiente ejemplo se usa este enfoque para devolver solo el título y el identificador de cada una de las listas de la colección.The previous example returns all properties of the lists in a website. To reduce unnecessary data transference between client and server, you can use LINQ query expressions to specify which properties to return. In JavaScript, you specify Include as part of the query string that is passed to the load(clientObject) method to specify which properties to return. The following example uses this approach to return only the title and ID of each list in the collection.

function retrieveSpecificListProperties(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    this.collList = oWebsite.get_lists();

    clientContext.load(collList, 'Include(Title, Id)');
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var listInfo = '';
    var listEnumerator = collList.getEnumerator();

    while (listEnumerator.moveNext()) {
        var oList = listEnumerator.get_current();
        listInfo += 'Title: ' + oList.get_title() + 
            ' ID: ' + oList.get_id().toString() + '\n';
    }
    alert(listInfo);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}


Almacenar listas recuperadas en una colecciónStore retrieved lists in a collection

Como se ve en el ejemplo siguiente, puede usar el método loadQuery(clientObjectCollection, exp) en lugar del método load(clientObject) para almacenar el valor devuelto en otra colección en lugar de almacenarlo en la propiedad de las listas.As the following example shows, you can use the loadQuery(clientObjectCollection, exp) method instead of the load(clientObject) method to store the return value in another collection instead of storing it in the lists property.

function retrieveSpecificListPropertiesToCollection(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    var collList = oWebsite.get_lists();

    this.listInfoCollection = clientContext.loadQuery(collList, 'Include(Title, Id)');
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var listInfo = '';

    for (var i = 0; i < this.listInfoCollection.length; i++) {
        var oList = this.listInfoCollection[i];
        listInfo += 'Title: ' + oList.get_title() + 
            ' ID: ' + oList.get_id().toString();
    }
    alert(listInfo.toString());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Aplicar filtros a la recuperación de listasApply filters to list retrieval

Como se muestra en el ejemplo siguiente, puede anidar instrucciones Include en una consulta JavaScript, para devolver metadatos de listas y campos. En el ejemplo se devuelven todos los campos de todas las listas dentro de un sitio web, y se muestra el título y el nombre interno de todos los campos cuyo nombre interno contiene la cadena "name".As the following example shows, you can nest Include statements in a JavaScript query to return metadata for both a list and its fields. The example returns all fields from all lists within a website and displays the title and internal name of all fields whose internal name contains the string "name".

function retrieveAllListsAllFields(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    var collList = oWebsite.get_lists();

    this.listInfoArray = clientContext.loadQuery(collList, 
        'Include(Title,Fields.Include(Title,InternalName))');

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this._onQueryFailed)
    );
}

function onQuerySucceeded() {
    var listInfo = '';

    for (var i = 0; i < this.listInfoArray.length; i++) {
        var oList = this.listInfoArray[i];
        var collField = oList.get_fields();
        var fieldEnumerator = collField.getEnumerator();
            
        while (fieldEnumerator.moveNext()) {
            var oField = fieldEnumerator.get_current();
            var regEx = new RegExp('name', 'ig');
            
            if (regEx.test(oField.get_internalName())) {
                listInfo += '\nList: ' + oList.get_title() + 
                    '\n\tField Title: ' + oField.get_title() + 
                    '\n\tField Name: ' + oField.get_internalName();
            }
        }
    }
    alert(listInfo);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}


Crear, actualizar y eliminar listasCreate, update, and delete lists

La creación, la actualización y la eliminación de listas por medio del modelo de objetos de cliente funcionan de manera similar al modo en que se llevan a cabo estas tareas mediante el modelo de objetos de cliente .NET. No obstante, las operaciones de cliente no se completarán hasta que se llame a la función executeQueryAsync(succeededCallback, failedCallback).Creating, updating, and deleting lists through the client object model works similarly to how you perform these tasks using the .NET client object model, although client operations do not complete until you call the executeQueryAsync(succeededCallback, failedCallback) function.

Crear y actualizar una listaCreate and update a list

Parar crear un objeto List con JavaScript, use el objeto ListCreationInformation para definir sus propiedades y luego pase este objeto a la función add(parameters) del objeto ListCollection. En el siguiente ejemplo se crea una lista de anuncios.To create a list object using JavaScript, use the ListCreationInformation object to define its properties, and then pass this object to the add(parameters) function of the ListCollection object. The following example creates a new announcements list.

function createList(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    
    var listCreationInfo = new SP.ListCreationInformation();
    listCreationInfo.set_title('My Announcements List');
    listCreationInfo.set_templateType(SP.ListTemplateType.announcements);

    this.oList = oWebsite.get_lists().add(listCreationInfo);

    clientContext.load(oList);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var result = oList.get_title() + ' created.';
    alert(result);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Si necesita actualizar la lista una vez creada, puede establecer las propiedades de la lista y llamar a la función update() antes de llamar a executeQueryAsync(succeededCallback, failedCallback), como se muestra en las siguientes modificaciones del ejemplo anterior.If you need to update the list after it has been created, you can set list properties and call the update() function before calling executeQueryAsync(succeededCallback, failedCallback), as shown in the following modifications of the previous example.

.
.
.
.
this.oList = oWebsite.get_lists().add(listCreationInfo);

oList.set_description('New Announcements List');
oList.update();

clientContext.load(oList);
clientContext.executeQueryAsync(
    Function.createDelegate(this, this.onQuerySucceeded), 
    Function.createDelegate(this, this.onQueryFailed)
);

Agregar un campo a una listaAdd a field to a list

Use add(field) o la función addFieldAsXml(schemaXml, addToDefaultView, options) del objeto FieldCollection para agregar un campo a la colección de campos de una lista. En el siguiente ejemplo se crea un campo y, posteriormente, se actualiza antes de llamar a executeQueryAsync(succeededCallback, failedCallback).Use the add(field) or addFieldAsXml(schemaXml, addToDefaultView, options) function of the FieldCollection object to add a field to the field collection of a list. The following example creates a field and then updates it before calling executeQueryAsync(succeededCallback, failedCallback).

function addFieldToList(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);

    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');
    this.oField = oList.get_fields().addFieldAsXml(
        '<Field DisplayName=\'MyField\' Type=\'Number\' />', 
        true, 
        SP.AddFieldOptions.defaultValue
    );

    var fieldNumber = clientContext.castTo(oField,SP.FieldNumber);
    fieldNumber.set_maximumValue(100);
    fieldNumber.set_minimumValue(35);
    fieldNumber.update();

    clientContext.load(oField);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var result = oField.get_title() + ' added.';
    alert(result);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Eliminar una listaDelete a list

Para eliminar una lista, llame a la función deleteObject() del objeto List, tal y como se muestra en el siguiente ejemplo.To delete a list, call the deleteObject() function of the list object, as shown in the following example.

function deleteList(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oWebsite = clientContext.get_web();
    this.listTitle = 'My Announcements List';

    this.oList = oWebsite.get_lists().getByTitle(listTitle);
    oList.deleteObject();

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    var result = listTitle + ' deleted.';
    alert(result);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Crear, actualizar y eliminar carpetasCreate, update, and delete folders

Puede manipular carpetas para organizar el contenido usando el modelo de objetos JavaScript. En las secciones siguientes se enseña a realizar operaciones básicas con las carpetas.You can manipulate folders to organize your content by using the JavaScript object model. The following sections show you how to perform basic operations on folders.

Crear una carpeta en una biblioteca de documentosCreate a folder in a document library

Para crear una carpeta, use un objeto ListItemCreationInformation, establezca el tipo de objeto subyacente en SP FileSystemObjectType.folder y páselo como parámetro en la función addItem(parameters) del objeto List.To create a folder, you use a ListItemCreationInformation object, set the underlying object type to SP.FileSystemObjectType.folder, and pass it as a parameter to the addItem(parameters) function of the List object. Establezca propiedades en el objeto de elemento de lista que devuelve este método y luego llame a la función update(), tal y como se muestra en el ejemplo siguiente.Set properties on the list item object that this method returns, and then call the update() function, as shown in the following example.

function createFolder(resultpanel) {
    var clientContext;
    var oWebsite;
    var oList;
    var itemCreateInfo;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();
    oList = oWebsite.get_lists().getByTitle("Shared Documents");

    itemCreateInfo = new SP.ListItemCreationInformation();
    itemCreateInfo.set_underlyingObjectType(SP.FileSystemObjectType.folder);
    itemCreateInfo.set_leafName("My new folder!");
    this.oListItem = oList.addItem(itemCreateInfo);
    this.oListItem.set_item("Title", "My new folder!");
    this.oListItem.update();

    clientContext.load(this.oListItem);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, successHandler),
        Function.createDelegate(this, errorHandler)
    );

    function successHandler() {
        resultpanel.innerHTML = "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to see your new folder.";
    }

    function errorHandler() {
        resultpanel.innerHTML =
            "Request failed: " + arguments[1].get_message();
    }
}

Actualizar una carpeta en una biblioteca de documentosUpdate a folder in a document library

Para actualizar el nombre de una carpeta, puede escribir en la propiedad FileLeafRef y llamar a la función update() para que los cambios surtan efecto cuando llame al método executeQueryAsync.To update the folder name, you can write to the FileLeafRef property and call the update() function so that changes take effect when you call the executeQueryAsync method.

function updateFolder(resultpanel) {
    var clientContext;
    var oWebsite;
    var oList;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();
    oList = oWebsite.get_lists().getByTitle("Shared Documents");

    this.oListItem = oList.getItemById(1);
    this.oListItem.set_item("FileLeafRef", "My updated folder");
    this.oListItem.update();

    clientContext.load(this.oListItem);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, successHandler),
        Function.createDelegate(this, errorHandler)
    );

    function successHandler() {
        resultpanel.innerHTML = "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to see your updated folder.";
    }

    function errorHandler() {
        resultpanel.innerHTML = "Request failed: " + arguments[1].get_message();
    }
}

Eliminar una carpeta de una biblioteca de documentosDelete a folder in a document library

Para eliminar una carpeta, llame a la función deleteObject() en el objeto. El ejemplo siguiente usa el método getFolderByServerRelativeUrl para recuperar la carpeta de la biblioteca de documentos y luego elimina el elemento.To delete a folder, call the deleteObject() function on the object. The following example uses the getFolderByServerRelativeUrl method to retrieve the folder from the document library and then deletes the item.

function deleteFolder(resultpanel) {
    var clientContext;
    var oWebsite;
    var folderUrl;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();

    clientContext.load(oWebsite);
    clientContext.executeQueryAsync(function () {
        folderUrl = oWebsite.get_serverRelativeUrl() + "/Lists/Shared Documents/Folder1";
        this.folderToDelete = oWebsite.getFolderByServerRelativeUrl(folderUrl);
        this.folderToDelete.deleteObject();

        clientContext.executeQueryAsync(
            Function.createDelegate(this, successHandler),
            Function.createDelegate(this, errorHandler)
        );
    }, errorHandler);

    function successHandler() {
        resultpanel.innerHTML = "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to make sure the folder is no longer there.";
    }

    function errorHandler() {
        resultpanel.innerHTML = "Request failed: " + arguments[1].get_message();
    }
}

Crear, leer, actualizar y eliminar archivosCreate, read, update, and delete files

Puede manipular archivos con el modelo de objetos de JavaScript. En las secciones siguientes se indica cómo realizar operaciones básicas con los archivos.You can manipulate files by using the JavaScript object model. The following sections show you how to perform basic operations on files.

Nota

Solo puede trabajar con archivos de como máximo 1,5 MB mediante el uso del modelo de objetos de JavaScript.You can only work with files up to 1.5 MB by using the JavaScript object model. Para cargar archivos de mayor tamaño, use el servicio Transferencia de estado representacional (REST).To upload larger files, use REST (Representational State Transfer). Para obtener más información, vea Completar operaciones básicas con puntos de conexión REST de SharePoint.For more information, see Complete basic operations using SharePoint REST endpoints.

Crear un archivo en una biblioteca de documentosCreate a file in a document library

Para crear un archivo, debe usar un objeto FileCreationInformation, definir el atributo de la dirección URL y anexar contenido como una matriz codificada base64 de bytes, como se ve en este ejemplo.To create files, you use a FileCreationInformation object, set the URL attribute, and append content as a base64 encoded array of bytes, as shown in this example.

function createFile(resultpanel) {
    var clientContext;
    var oWebsite;
    var oList;
    var fileCreateInfo;
    var fileContent;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();
    oList = oWebsite.get_lists().getByTitle("Shared Documents");

    fileCreateInfo = new SP.FileCreationInformation();
    fileCreateInfo.set_url("my new file.txt");
    fileCreateInfo.set_content(new SP.Base64EncodedByteArray());
    fileContent = "The content of my new file";

    for (var i = 0; i < fileContent.length; i++) {
        
        fileCreateInfo.get_content().append(fileContent.charCodeAt(i));
    }

    this.newFile = oList.get_rootFolder().get_files().add(fileCreateInfo);

    clientContext.load(this.newFile);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, successHandler),
        Function.createDelegate(this, errorHandler)
    );

    function successHandler() {
        resultpanel.innerHTML =
            "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to see your new file.";
    }

    function errorHandler() {
        resultpanel.innerHTML = "Request failed: " + arguments[1].get_message();
    }
}

Leer un archivo de una biblioteca de documentosRead a file in a document library

Para leer el contenido de un archivo, debe realizar una operación GET en la dirección URL del archivo, como se ve en el ejemplo siguiente.To read a file's content, you perform a GET operation on the file's URL, as shown in the following example.

function readFile(resultpanel) {
    var clientContext;
    var oWebsite;
    var fileUrl;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();

    clientContext.load(oWebsite);
    clientContext.executeQueryAsync(function () {
        fileUrl = oWebsite.get_serverRelativeUrl() +
            "/Lists/Shared Documents/TextFile1.txt";
        $.ajax({
            url: fileUrl,
            type: "GET"
        })
            .done(Function.createDelegate(this, successHandler))
            .error(Function.createDelegate(this, errorHandler));
    }, errorHandler);

    function successHandler(data) {
        resultpanel.innerHTML =
            "The content of file \"TextFile1.txt\": " + data
    }

    function errorHandler() {
        resultpanel.innerHTML =
            "Request failed: " + arguments[2];
    }
}

Actualizar un archivo de una biblioteca de documentosUpdate a file in a document library

Para actualizar el contenido de un archivo, puede usar un objeto FileCreationInformation y definir el atributo de sobrescritura en true usando el método set_overwrite(), como se ve en este ejemplo.To update the file's content, you can use a FileCreationInformation object, and set the overwrite attribute to true by using the set_overwrite() method, as shown in this example.

function updateFile(resultpanel) {
    var clientContext;
    var oWebsite;
    var oList;
    var fileCreateInfo;
    var fileContent;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();
    oList = oWebsite.get_lists().getByTitle("Shared Documents");

    fileCreateInfo = new SP.FileCreationInformation();
    fileCreateInfo.set_url("TextFile1.txt");
    fileCreateInfo.set_content(new SP.Base64EncodedByteArray());
    fileCreateInfo.set_overwrite(true);
    fileContent = "The updated content of my file";

    for (var i = 0; i < fileContent.length; i++) {

        fileCreateInfo.get_content().append(fileContent.charCodeAt(i));
    }

    this.existingFile = oList.get_rootFolder().get_files().add(fileCreateInfo);

    clientContext.load(this.existingFile);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, successHandler),
        Function.createDelegate(this, errorHandler)
    );

    function successHandler() {
        resultpanel.innerHTML =
            "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to see the updated \"TextFile1.txt\" file.";
    }

    function errorHandler() {
        resultpanel.innerHTML =
            "Request failed: " + arguments[1].get_message();
    }
}

Eliminar un archivo de una biblioteca de documentosDelete a file in a document library

Para eliminar un archivo, llame a la función deleteObject() en el objeto. El ejemplo siguiente usa el método getFileByServerRelativeUrl para recuperar el archivo de la biblioteca de documentos y luego elimina el elemento.To delete a file, call the deleteObject() function on the object. The following example uses the getFileByServerRelativeUrl method to retrieve the file from the document library, and then deletes the item.

function deleteFile(resultpanel) {
    var clientContext;
    var oWebsite;
    var fileUrl;

    clientContext = new SP.ClientContext.get_current();
    oWebsite = clientContext.get_web();

    clientContext.load(oWebsite);
    clientContext.executeQueryAsync(function () {
        fileUrl = oWebsite.get_serverRelativeUrl() +
            "/Lists/Shared Documents/TextFile1.txt";
        this.fileToDelete = oWebsite.getFileByServerRelativeUrl(fileUrl);
        this.fileToDelete.deleteObject();

        clientContext.executeQueryAsync(
            Function.createDelegate(this, successHandler),
            Function.createDelegate(this, errorHandler)
        );
    }, errorHandler);

    function successHandler() {
        resultpanel.innerHTML =
            "Go to the " +
            "<a href='../Lists/Shared Documents'>document library</a> " +
            "to confirm that the \"TextFile1.txt\" file has been deleted.";
    }

    function errorHandler() {
        resultpanel.innerHTML = "Request failed: " + arguments[1].get_message();
    }
}

Tareas de elemento de lista de SharePointSharePoint list item tasks

Para devolver elementos de una lista con JavaScript, use la función getItemById(id) para devolver un solo elemento o la función getItems(query) para devolver varios elementos.To return items from a list by using JavaScript, use the getItemById(id) function to return a single item, or use the getItems(query) function to return multiple items. Después, use la función load(clientObject) para obtener los objetos de elemento de lista que representan los elementos.You then use the load(clientObject) function to attain list item objects that represent the items.

Recuperar elementos de una listaRetrieve items from a list

La función getItems(query) permite definir una consulta Lenguaje de marcado de aplicaciones de colaboración (CAML) que especifique qué elementos se van a devolver. Puede pasar un objeto CamlQuery no definido para devolver todos los elementos de la lista, o bien usar la función set_viewXml para definir una consulta CAML y devolver los elementos que cumplan con criterios específicos. En el siguiente ejemplo se muestran los valores de columna Identificador, Título y Cuerpo de los primeros 100 elementos de la lista Anuncios, empezando por los elementos de lista cuyo identificador de colección es mayor que 10.The getItems(query) function enables you to define a Collaborative Application Markup Language (CAML) query that specifies which items to return. You can pass an undefined CamlQuery object to return all items from the list, or use the set_viewXml function to define a CAML query and return items that meet specific criteria. The following example displays the ID, in addition to the Title and Body column values, of the first 100 items in the Announcements list, starting with list items whose collection ID is greater than 10.

function retrieveListItems(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');
        
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml(
        '<View><Query><Where><Geq><FieldRef Name=\'ID\'/>' + 
        '<Value Type=\'Number\'>1</Value></Geq></Where></Query>' + 
        '<RowLimit>10</RowLimit></View>'
    );
    this.collListItem = oList.getItems(camlQuery);
        
    clientContext.load(collListItem);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    ); 
}

function onQuerySucceeded(sender, args) {
    var listItemInfo = '';
    var listItemEnumerator = collListItem.getEnumerator();
        
    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();
        listItemInfo += '\nID: ' + oListItem.get_id() + 
            '\nTitle: ' + oListItem.get_item('Title') + 
            '\nBody: ' + oListItem.get_item('Body');
    }

    alert(listItemInfo.toString());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Usar el método Include para obtener acceso a propiedades de objetos ListItemUse the Include method to access properties of ListItem objects

Hay cuatro propiedades de objetos ListItem que no están disponibles de forma predeterminada cuando se devuelven los atributos displayName, effectiveBasePermissions, ** hasUniqueRoleAssignments** y roleAssignments de los elementos de lista.Four properties of ListItem objects are not available by default when you return the list items displayName, effectiveBasePermissions, hasUniqueRoleAssignments, and roleAssignments. El ejemplo anterior devuelve una excepción PropertyOrFieldNotInitializedException si intenta tener acceso a una de estas propiedades.The previous example returns a PropertyOrFieldNotInitializedException if you try to access one of these properties. Para acceder a estas propiedades, use el método Include como parte de la cadena de consulta, tal y como se muestra en el ejemplo siguiente.To access these properties, use the Include method as part of the query string, as shown in the following example.

Nota

Al usar LINQ para crear consultas en el modelo de objetos cliente, se usa LINQ to Objects, no el proveedor LINQ to SharePoint, que solo puede usarse cuando se escribe código en el modelo de objetos de servidor.When you use LINQ to create queries against the client object model, you are using LINQ to Objects, not the LINQ to SharePoint provider, which can only be used when you write code against the server object model.

function retrieveListItemsInclude(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');

    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><RowLimit>100</RowLimit></View>');
    this.collListItem = oList.getItems(camlQuery);

    clientContext.load(
        collListItem, 
        'Include(Id, DisplayName, HasUniqueRoleAssignments)'
    );
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded(sender, args) {
    var listItemInfo = '';
    var listItemEnumerator = collListItem.getEnumerator();
        
    while (listItemEnumerator.moveNext()) {
        var oListItem = listItemEnumerator.get_current();
        listItemInfo += '\nID: ' + oListItem.get_id() + 
            '\nDisplay name: ' + oListItem.get_displayName() + 
            '\nUnique role assignments: ' + 
            oListItem.get_hasUniqueRoleAssignments();
    }

    alert(listItemInfo.toString());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}


Dado que en este ejemplo se usa un método Include, solo las propiedades especificadas están disponibles después de ejecutar la consulta.Because this example uses an Include, only the specified properties are available after query execution. Por lo tanto, recibirá una excepción PropertyOrFieldNotInitializedException si intenta obtener acceso a otras propiedades además de las que se ha especificado.Therefore, you receive a PropertyOrFieldNotInitializedException if you try to access other properties beyond those that have been specified. Además, recibirá este error si intenta usar funciones tales como get_contentType o get_parentList para tener acceso a las propiedades de los objetos que contiene.In addition, you receive this error if you try to use functions such as get_contentType or get_parentList to access the properties of containing objects.

Restricciones en la recuperación de elementosRestrictions on retrieving items

El método loadQuery(clientObjectCollection, exp) del modelo de objetos JavaScript de SharePoint Foundation 2010 no admite los métodos y operadores de LINQ que usa el modelo de objetos administrado.The loadQuery(clientObjectCollection, exp) method of the JavaScript object model in SharePoint Foundation 2010 does not support LINQ methods and operators that are used by the managed object model.


Crear, actualizar y eliminar elementos de listaCreate, update, and delete list items

La creación, actualización o eliminación de elementos de lista a través del modelo de objetos de cliente funciona de forma similar a cómo se realizan estas tareas a través del modelo de objetos del servidor.Creating, updating, or deleting list items through the client object model works similarly to performing these tasks through the server object model. Crear un objeto de elemento de lista, establece sus propiedades y, después, actualiza el objeto.You create a list item object, set its properties, and then update the object. Para modificar o eliminar un objeto de elemento de lista, use la función getById(id) del objeto ListItemCollection para devolver el objeto y después, puede o bien establecer propiedades y llamar a la función update en el objeto que devuelve este método o llamar al propio método del objeto para su eliminación.To modify or delete a list item object, use the getById(id) function of the ListItemCollection object to return the object, and then either set properties and call update on the object that this method returns, or call the object's own method for deletion. A diferencia del modelo de objetos de servidor, cada una de estas operaciones en el modelo de objetos de cliente debe terminar con una llamada a executeQueryAsync(succeededCallback, failedCallback) para que los cambios surtan efecto en el servidor.Unlike the server object model, each of these operations in the client object model must conclude with a call to executeQueryAsync(succeededCallback, failedCallback) for changes to take effect on the server.

Crear un elemento de listaCreate a list item

Para crear elementos de lista, cree un objeto ListItemCreationInformation, establezca sus propiedades y páselo como parámetro de la función addItem(parameters) del objeto List.To create list items, you create a ListItemCreationInformation object, set its properties, and pass it as a parameter to the addItem(parameters) function of the List object. Establezca propiedades en el objeto de elemento de lista que devuelve este método y luego llame a la función update(), tal y como se muestra en el ejemplo siguiente.Set properties on the list item object that this method returns, and then call the update() function, as shown in the following example.

function createListItem(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');
        
    var itemCreateInfo = new SP.ListItemCreationInformation();
    this.oListItem = oList.addItem(itemCreateInfo);
    oListItem.set_item('Title', 'My New Item!');
    oListItem.set_item('Body', 'Hello World!');
    oListItem.update();

    clientContext.load(oListItem);
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    alert('Item created: ' + oListItem.get_id());
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Actualizar un elemento de listaUpdate a list item

Para establecer la mayoría de las propiedades del elemento de lista, puede usar un indizador de columna para realizar una asignación y llamar a la función update() para que los cambios tengan efecto al llamar a executeQueryAsync(succeededCallback, failedCallback).To set most list item properties, you can use a column indexer to make an assignment, and call the update() function so that changes take effect when you call executeQueryAsync(succeededCallback, failedCallback). En el ejemplo siguiente se establece el título del tercer elemento de la lista de anuncios.The following example sets the title of the third item in the Announcements list.

function updateListItem(siteUrl) {
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');

    this.oListItem = oList.getItemById(3);
    oListItem.set_item('Title', 'My Updated Title');
    oListItem.update();

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    alert('Item updated!');
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Eliminar un elemento de listaDelete a list item

Para eliminar un elemento de lista, llame a la función deleteObject() del objeto. En el siguiente ejemplo se usa la función getItemById(id) para devolver el segundo elemento de la lista y luego se elimina el elemento. SharePoint mantiene los identificadores de enteros de los elementos dentro de las colecciones aunque se hayan eliminado. Por ejemplo, el segundo elemento de una lista podría no tener el 2 como identificador. Si se llama a la función deleteObject() para un elemento que no existe, se devuelve la excepción ServerException.To delete a list item, call the deleteObject() function on the object. The following example uses the getItemById(id) function to return the second item from the list, and then deletes the item. SharePoint maintains the integer IDs of items within collections, even if they have been deleted. So, for example, the second item in a list might not have 2 as its identifier. A ServerException is returned if the deleteObject() function is called for an item that does not exist.

function deleteListItem(siteUrl) {
    this.itemId = 2;
    var clientContext = new SP.ClientContext(siteUrl);
    var oList = clientContext.get_web().get_lists().getByTitle('Announcements');
    this.oListItem = oList.getItemById(itemId);
    oListItem.deleteObject();

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onQuerySucceeded), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function onQuerySucceeded() {
    alert('Item deleted: ' + itemId);
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Por ejemplo, si desea recuperar el nuevo recuento de elementos que resulta de una operación de eliminación, incluya una llamada al método update() para actualizar la lista. Además, debe cargar el objeto de lista en sí o la propiedad itemCount en el objeto de lista antes de ejecutar la consulta. Si desea recuperar un recuento de inicio y finalización de los elementos de lista, debe ejecutar dos consultas y devolver el recuento de elemento dos veces, tal como se muestra en la modificación siguiente del ejemplo anterior.If you want to retrieve, for example, the new item count that results from a delete operation, include a call to the update() method to refresh the list. In addition, you must load either the list object itself or the itemCount property on the list object before executing the query. If you want to retrieve both a start and end count of the list items, you must execute two queries and return the item count twice, as shown in the following modification of the previous example.

function deleteListItemDisplayCount(siteUrl) {
    this.clientContext = new SP.ClientContext(siteUrl);
    this.oList = clientContext.get_web().get_lists().getByTitle('Announcements');
    clientContext.load(oList);

    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.deleteItem), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function deleteItem() {
    this.itemId = 58;
    this.startCount = oList.get_itemCount();
    this.oListItem = oList.getItemById(itemId);
    oListItem.deleteObject();

    oList.update();
    clientContext.load(oList);
        
    clientContext.executeQueryAsync(
        Function.createDelegate(this, this.displayCount), 
        Function.createDelegate(this, this.onQueryFailed)
    );
}

function displayCount() {
    var endCount = oList.get_itemCount();
    var listItemInfo = 'Item deleted: ' + itemId + 
        '\nStart Count: ' +  startCount + 
        ' End Count: ' + endCount;
        
    alert(listItemInfo)
}

function onQueryFailed(sender, args) {
    alert('Request failed. ' + args.get_message() + 
        '\n' + args.get_stackTrace());
}

Obtener acceso a objetos en la web de hostAccess objects in the host web

Al desarrollar el complemento, puede ser necesario acceder a la web de host para interactuar con sus elementos. Use el objeto AppContextSite para hacer referencia a la web de host o a otros sitios de SharePoint, como se ve en el ejemplo siguiente. Puede consultar el ejemplo de código completo en Obtener el título de la web de host usando la biblioteca entre dominios (JSOM).While developing your add-in, you might need to access the host web to interact with items in it. Use the AppContextSite object to reference the host web or other SharePoint sites, as shown in the following example. For a full code sample, see Get the host web title using the cross-domain library (JSOM).

function execCrossDomainRequest(appweburl, hostweburl) {
    // context: The ClientContext object provides access to
    //      the web and lists objects.
    // factory: Initialize the factory object with the
    //      add-in web URL.
    var context;
    var factory;
    var appContextSite;

    context = new SP.ClientContext(appweburl);
    factory = new SP.ProxyWebRequestExecutorFactory(appweburl);
    context.set_webRequestExecutorFactory(factory);
    appContextSite = new SP.AppContextSite(context, hostweburl);

    this.web = appContextSite.get_web();
    context.load(this.web);

    // Execute the query with all the previous 
    //  options and parameters.
    context.executeQueryAsync(
        Function.createDelegate(this, successHandler), 
        Function.createDelegate(this, errorHandler)
    );

    // Function to handle the success event.
    // Prints the host web's title to the page.
    function successHandler() {
        alert(this.web.get_title());
    }

    // Function to handle the error event.
    // Prints the error message to the page.
    function errorHandler(data, errorCode, errorMessage) {
        alert("Could not complete cross-domain call: " + errorMessage);
    }
}

En el ejemplo anterior se usa la biblioteca entre dominios de SharePoint para el acceso a la web de host.The previous example uses the cross-domain library in SharePoint to access the host web. Para obtener más información, vea Obtener acceso a datos de SharePoint desde complementos con la biblioteca entre dominios.For more information, see Access SharePoint data from add-ins using the cross-domain library.

Vea tambiénSee also