Código fuente (Vista)
Actualización: noviembre 2007
La vista Código fuente muestra el código de formato HTML de la página Web, que se puede editar. De forma predeterminada, se muestran todos los elementos HTML y las secuencias de comandos al seleccionar inicialmente la vista Código fuente. Puede arrastrar elementos desde el Cuadro de herramientas, igual que lo haría al editar una página Web en la vista Diseño, y ver el código de formato insertado en el documento.
Para seleccionar la vista Diseño, haga clic en la ficha Código fuente situada en la parte inferior de la ventana del Diseñador HTML.
Esta vista proporciona las siguientes ventajas respecto a la vista Diseño:
Puede precisar con exactitud el código de formato de los elementos y controles.
Puede dar formato al documento como desee.
Puede editar elementos que no están en el cuerpo. La vista Diseño sólo muestra los elementos ubicados entre los elementos body. Por ejemplo, puede editar directamente el elemento head mientras trabaja en la vista Código fuente.
Puede editar las directivas de página.
Puede crear y editar la secuencia de comandos del cliente.
Puede editar el código del servidor de la página mientras trabaja en una página de un solo archivo (en contraposición a una página con un archivo de código subyacente).
Cuando cambia a la vista Diseño, cualquier cambio realizado en la vista Código fuente se refleja inmediatamente.
.gif "Nota") Nota: |
|---|
Algunos errores de código de formato pueden evitar que alterne a la vista Diseño porque los errores ocasionarían problemas en el editor, incluida la posible pérdida de datos. Por ejemplo, si no se cierra una etiqueta correctamente, el editor muestra un error y detiene el modificador de vista. Los detalles sobre el error se muestran en Lista de errores (Ventana). Puede obtener una vista previa de la página ejecutándola, aunque no pueda cambiar a la vista Diseño. |
Navegar por la vista Código fuente
Para ayudarle a navegar por los elementos y seleccionarlos, la vista Código fuente incluye las siguientes opciones:
Explorador de etiquetas El explorador de etiquetas muestra el elemento actual, junto con la jerarquía de los elementos principales a la que pertenece. Puede utilizarlo para ver el elemento que tiene el foco y para navegar desde el elemento actual a un elemento superior de la jerarquía. Para obtener información detallada, vea Exploración de etiquetas en el Editor HTML de Visual Web Developer.
Esquema del documento La ventana del esquema del documento permite buscar y seleccionar todos los elementos de un documento, incluidos los que no se muestran. Para obtener información detallada, vea Cómo: Explorar en el Editor HTML de Visual Web Developer.
Validación
En la vista Código fuente, el editor comprueba automáticamente la sintaxis del documento y marca las etiquetas, los atributos o valores que no son válidos. Puede seleccionar un esquema de validación para trabajar, bien por explorador (por ejemplo, Microsoft Internet Explorer) o bien por estándar (por ejemplo, XHTML 1.1 Strict). Para obtener información detallada, vea Validación de formato en Visual Web Developer.
IntelliSense
IntelliSense es la característica de Visual Studio que muestra una lista desplegable de las posibles palabras clave que finalizarían lo que está escribiendo. Por ejemplo, si escribe el principio de un nombre de clase, IntelliSense muestra una lista desplegable con todos los nombres de clase que comienzan por los caracteres escritos hasta ahora.
En la vista Código fuente, el editor muestra IntelliSense casi para todos elementos, incluidos los controles de servidor Web ASP.NET, el código de formato, directivas de página y secuencia de comandos del cliente. La característica IntelliSense del editor la controla el esquema de validación actual; por tanto, el editor no la proporciona para etiquetas, atributos o valores que no sean válidos para el esquema actual.
| Nota: |
|---|
Puede desactivar la finalización de instrucciones. Para obtener información detallada, vea General, HTML, Editor de texto, Opciones (Cuadro de diálogo). |
Formato
El editor proporciona las siguientes opciones para dar formato al documento y a etiquetas individuales:
Arrastrar y pegar documentos Al arrastrar los elementos desde el Cuadro de herramientas o pegarlos desde el Portapapeles, el editor puede crear los elementos exactamente con el formato que tenían antes o volverles a aplicar formato en función de las opciones especificadas. Para obtener información detallada, vea Varios, HTML, Editor de texto, Opciones (Cuadro de diálogo).
Agregar comillas o etiquetas de cierre Puede establecer opciones que hagan que el editor inserte automáticamente comillas al principio y al final de los valores de los atributos y que cree automáticamente una etiqueta de cierre al finalizar un etiqueta de inicio. Para obtener información detallada, vea Formato, HTML, Editor de texto, Opciones (Cuadro de diálogo).
Dar formato por la etiqueta Puede especificar las reglas de cómo da formato el editor a las etiquetas a medida que crea elementos. Las opciones incluyen cómo poner en mayúsculas etiquetas y atributos, así como dónde colocar los saltos de línea. Para obtener información detallada, vea Opciones específicas de etiqueta.
Dar formato a elementos o documentos Puede aplicar las reglas de formato actuales a una sección seleccionada o al documento como un todo.
Esquematizar documentos Puede contraer y expandir los elementos para crear más espacio de trabajo en el editor. Por ejemplo, puede contraer un elemento table para ocultar todas sus filas y celdas y, a continuación, expandirlo cuando desee editarlo. Puede contraer y expandir manualmente los elementos y especificar las reglas de longitud de un elemento antes de que el editor agregue automáticamente esquematización a un elemento. Para obtener información detallada, vea Cómo: Contraer y expandir elementos HTML en Visual Web Developer.
Escribir secuencia de comandos del cliente y código de servidor
En la vista Código fuente, puede crear una secuencia de comandos del cliente que se ejecute en el explorador. Si trabaja con una página Web ASP.NET de un solo archivo, también puede editar el código del servidor de la página en esta vista. Para obtener información sobre la secuencia de comandos del cliente en páginas ASP.NET, vea Script de cliente en páginas web ASP.NET. Para obtener información sobre las páginas ASP.NET de un solo archivo, vea Modelo de código de las páginas web ASP.NET.
Secuencias de comandos de cliente
Puede escribir la secuencia de comandos del cliente como lo haría en cualquier editor, aunque forme parte de un elemento o de su propio bloque <script>. Dentro de un bloque de secuencia de comandos, el editor pasa IntelliSense como clave al modelo de objetos del documento actual y al lenguaje de secuencia de comandos del cliente especificado para este bloque de secuencia de comandos. Si no especifica ningún lenguaje, el editor supone que es ECMAScript.
| Nota: |
|---|
El editor no valida la secuencia de comandos del cliente. |
El editor muestra dos listas desplegables en la parte superior de la ventana. Para la creación de secuencia de comandos, la lista desplegable de la izquierda muestra una lista de los objetos del documento para los que se pueden escribir controladores de eventos; la lista de la derecha muestra los eventos del objeto seleccionado. Puede crear un nuevo controlador seleccionando el objeto y, a continuación, el evento. Los eventos que ya poseen controlador aparecen en negrita.
Para ayudarle a navegar por la secuencia de comandos del cliente, la lista desplegable de la izquierda también muestra la opción Secuencia de comandos del cliente. Al seleccionar esta opción, la lista desplegable de la derecha muestra una lista de los controladores de eventos de la secuencia de comandos del cliente. Puede seleccionar un controlador y pasar a él directamente.
Código de servidor
Si trabaja en una página Web ASP.NET que utiliza el modelo de código de un solo archivo, la vista Código fuente muestra el código de servidor de la página en un bloque de secuencia de comandos que incluye el atributo .
| Nota: |
|---|
El código de servidor no requiere ningún atributo de lenguaje; el lenguaje del código de servidor de la página se establece en la directiva @ Page. |
Por lo que respecta al código de servidor, la lista desplegable situada en la parte superior izquierda de la página muestra los controles del servidor para los que puede escribir código. Esta lista muestra una lista de los eventos del control seleccionado actualmente. Puede crear un nuevo controlador de eventos seleccionando el objeto y, a continuación, el evento. Los eventos que ya poseen controlador aparecen en negrita.