在纯JavaScript 应用中集成Viewer控件
此页面提供ActiveReportsJS报表查看器组件的详细概述。 您可以查看入门指南教程，以获取有关将该组件集成到纯JavaScript应用程序的简明指南。
ActiveReportsJS脚本和样式
要在纯JavaScript应用程序中使用ActiveReportsJS Viewer组件，它应包括以下脚本和样式：
- ar-js-core.js：必需，提供核心功能
- ar-js-viewer.js：必需，提供查看器组件
- ar-js-viewer.css：必需，提供查看器组件的默认样式
- ar-js-pdf.js：可选，提供导出为PDF
- ar-js-xlsx.js：可选，提供导出到XLS
- ar-js-html.js：可选，提供导出到HTML
包含这些脚本的最简单方法是使用CDN引用，例如：
<link
rel="stylesheet"
href="http://cdn.grapecity.com/activereportsjs/2.0.0/styles/ar-js-ui.css"
type="text/css"
/>
<link
rel="stylesheet"
href="http://cdn.grapecity.com/activereportsjs/2.0.0/styles/ar-js-viewer.css"
type="text/css"
/>
<script src="http://cdn.grapecity.com/activereportsjs/2.0.0/dist/ar-js-core.js"></script>
<script src="http://cdn.grapecity.com/activereportsjs/2.0.0/dist/ar-js-viewer.js"></script>
<script src="http://cdn.grapecity.com/activereportsjs/2.0.0/dist/ar-js-pdf.js"></script>
<script src="http://cdn.grapecity.com/activereportsjs/2.0.0/dist/ar-js-xlsx.js"></script>
<script src="http://cdn.grapecity.com/activereportsjs/2.0.0/dist/ar-js-html.js"></script>
或者，您可以从ActiveReportsJS 下载页面. 下载这些脚本和样式。 您可以分别在下载包的“ dist”和“ styles”文件夹中找到它们。
最后, 可以将@grapecity/activereports 软件包安装在应用程序的文件夹中，并且可以从```node_modules \ @grapecity \ activereports \ dist ``和node_modules \ @grapecity \ activereports \ styles ``文件夹
初始化ActiveReportsJS Viewer组件
脚本和样式加载后，可以通过调用ActiveReports.Viewer构造函数并将宿主元素的CSS选择器传递给Viewer组件来进行初始化，例如：
<body>
<div id="viewer-host"></div>
<script>
var viewer = new ActiveReports.Viewer("#viewer-host");
</script>
</body>
ActiveReports.Viewer的实例公开了方法和属性 ，可用于自定义查看器的外观，预览报告，打印或导出它们。