本文整理匯總了TypeScript中dom5.append函數的典型用法代碼示例。如果您正苦於以下問題：TypeScript append函數的具體用法？TypeScript append怎麽用？TypeScript append使用的例子？那麽, 這裏精選的函數代碼示例或許可以為您提供幫助。
在下文中一共展示了append函數的10個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: prepend
export function prepend(parent: ASTNode, node: ASTNode) {
if (parent.childNodes && parent.childNodes.length) {
dom5.insertBefore(parent, parent.childNodes[0], node);
} else {
dom5.append(parent, node);
}
}示例2: createLinks
export function createLinks(
html: string,
baseUrl: string,
deps: Set<string>,
absolute: boolean = false): string {
const ast = parse5.parse(html, {locationInfo: true});
const baseTag = dom5.query(ast, dom5.predicates.hasTagName('base'));
const baseTagHref = baseTag ? dom5.getAttribute(baseTag, 'href') : '';
// parse5 always produces a <head> element.
const head = dom5.query(ast, dom5.predicates.hasTagName('head'))!;
for (const dep of deps) {
let href;
if (absolute && !baseTagHref) {
href = absUrl(dep);
} else {
href = relativeUrl(absUrl(baseUrl), absUrl(dep));
}
const link = dom5.constructors.element('link');
dom5.setAttribute(link, 'rel', 'prefetch');
dom5.setAttribute(link, 'href', href);
dom5.append(head, link);
}
dom5.removeFakeRootElements(ast);
return parse5.serialize(ast);
}示例3: processFile
private async processFile(file: File): Promise<File> {
if (file.path !== this.entrypoint) {
return file;
}
const contents = await getFileContents(file);
const document = parse5.parse(contents);
const babelHelpersFragment =
parse5.parseFragment('\n\n<script></script>\n\n');
dom5.setTextContent(
babelHelpersFragment.childNodes![1]!,
await fs.readFile(
path.join(__dirname, 'babel-helpers.min.js'), 'utf-8'));
const firstScriptOrImport = dom5.nodeWalk(document, scriptOrImport);
if (firstScriptOrImport) {
dom5.insertBefore(
firstScriptOrImport.parentNode!,
firstScriptOrImport,
babelHelpersFragment);
} else {
const head =
dom5.query(document, dom5.predicates.hasTagName('head')) || document;
dom5.append(head, babelHelpersFragment);
}
const newFile = file.clone();
newFile.contents = new Buffer(parse5.serialize(document), 'utf-8');
return newFile;
}示例4: _addSharedImportsToShell
_addSharedImportsToShell(bundles: Map<string, string[]>): string {
console.assert(this.shell != null);
let shellDeps = bundles.get(this.shell)
.map((d) => path.relative(path.dirname(this.shell), d));
let file = this.analyzer.files.get(this.shell);
console.assert(file != null);
let contents = file.contents.toString();
let doc = dom5.parse(contents);
let imports = dom5.queryAll(doc, dom5.predicates.AND(
dom5.predicates.hasTagName('link'),
dom5.predicates.hasAttrValue('rel', 'import')
));
// Remove all imports that are in the shared deps list so that we prefer
// the ordering or shared deps. Any imports left should be independent of
// ordering of shared deps.
let shellDepsSet = new Set(shellDeps);
for (let _import of imports) {
if (shellDepsSet.has(dom5.getAttribute(_import, 'href'))) {
dom5.remove(_import);
}
}
// Append all shared imports to the end of <head>
let head = dom5.query(doc, dom5.predicates.hasTagName('head'));
for (let dep of shellDeps) {
let newImport = dom5.constructors.element('link');
dom5.setAttribute(newImport, 'rel', 'import');
dom5.setAttribute(newImport, 'href', dep);
dom5.append(head, newImport);
}
let newContents = dom5.serialize(doc);
return newContents;
}示例5: _moveUnhiddenHtmlImportsIntoHiddenDiv
/**
* Move any remaining htmlImports that are not inside the hidden div
* already, into the hidden div.
*/
private _moveUnhiddenHtmlImportsIntoHiddenDiv(ast: ASTNode) {
const unhiddenHtmlImports = dom5.queryAll(
ast,
dom5.predicates.AND(
matchers.eagerHtmlImport,
dom5.predicates.NOT(matchers.inHiddenDiv)));
for (const htmlImport of unhiddenHtmlImports) {
removeElementAndNewline(htmlImport);
dom5.append(this._findOrCreateHiddenDiv(ast), htmlImport);
}
}示例6: _attachHiddenDiv
/**
* Set the hidden div at the appropriate location within the document. The
* goal is to place the hidden div at the same place as the first html
* import. However, the div can't be placed in the `<head>` of the document
* so if first import is found in the head, we prepend the div to the body.
* If there is no body, we'll just attach the hidden div to the document at
* the end.
*/
private _attachHiddenDiv(ast: ASTNode, hiddenDiv: ASTNode) {
const firstHtmlImport = dom5.query(ast, matchers.eagerHtmlImport);
const body = dom5.query(ast, matchers.body);
if (body) {
if (firstHtmlImport &&
dom5.predicates.parentMatches(matchers.body)(firstHtmlImport)) {
insertAfter(firstHtmlImport, hiddenDiv);
} else {
prepend(body, hiddenDiv);
}
} else {
dom5.append(ast, hiddenDiv);
}
}示例7: _addSharedImportsToShell
_addSharedImportsToShell(bundles: Map<string, string[]>): string {
console.assert(this.shell != null);
let shellUrl = urlFromPath(this.root, this.shell);
let shellUrlDir = posixPath.dirname(shellUrl);
let shellDeps = bundles.get(shellUrl)
.map((d) => posixPath.relative(shellUrlDir, d));
logger.debug('found shell dependencies', {
shellUrl: shellUrl,
shellUrlDir: shellUrlDir,
shellDeps: shellDeps,
});
let file = this.analyzer.getFile(this.shell);
console.assert(file != null);
let contents = file.contents.toString();
let doc = dom5.parse(contents);
let imports = dom5.queryAll(doc, dom5.predicates.AND(
dom5.predicates.hasTagName('link'),
dom5.predicates.hasAttrValue('rel', 'import')
));
logger.debug('found html import elements', {
imports: imports.map((el) => dom5.getAttribute(el, 'href')),
});
// Remove all imports that are in the shared deps list so that we prefer
// the ordering or shared deps. Any imports left should be independent of
// ordering of shared deps.
let shellDepsSet = new Set(shellDeps);
for (let _import of imports) {
let importHref = dom5.getAttribute(_import, 'href');
if (shellDepsSet.has(importHref)) {
logger.debug(`removing duplicate import element "${importHref}"...`);
dom5.remove(_import);
}
}
// Append all shared imports to the end of <head>
let head = dom5.query(doc, dom5.predicates.hasTagName('head'));
for (let dep of shellDeps) {
let newImport = dom5.constructors.element('link');
dom5.setAttribute(newImport, 'rel', 'import');
dom5.setAttribute(newImport, 'href', dep);
dom5.append(head, newImport);
}
let newContents = dom5.serialize(doc);
return newContents;
}示例8: _moveOrderedImperativesFromHeadIntoHiddenDiv
/**
* When an HTML Import is encountered in the head of the document, it needs
* to be moved into the hidden div and any subsequent order-dependent
* imperatives (imports, styles, scripts) must also be move into the
* hidden div.
*/
private _moveOrderedImperativesFromHeadIntoHiddenDiv(ast: ASTNode) {
const head = dom5.query(ast, matchers.head);
if (!head) {
return;
}
const firstHtmlImport = dom5.query(head, matchers.eagerHtmlImport);
if (!firstHtmlImport) {
return;
}
for (const node of [firstHtmlImport].concat(
siblingsAfter(firstHtmlImport))) {
if (matchers.orderedImperative(node)) {
removeElementAndNewline(node);
dom5.append(this._findOrCreateHiddenDiv(ast), node);
}
}
}示例9: pullUpDeps
pullUpDeps(
file: File,
deps: string[],
type: 'import' | 'prefetch'
) {
let contents = file.contents.toString();
let ast = dom5.parse(contents);
let head = dom5.query(ast, dom5.predicates.hasTagName('head'));
for (let dep of deps) {
if (dep.startsWith(this.root)) {
dep = path.relative(file.dirname, dep);
}
// prefetched deps should be absolute, as they will be in the main file
if (type === 'prefetch') {
dep = path.join('/', dep);
}
let link = dom5.constructors.element('link');
dom5.setAttribute(link, 'rel', type);
dom5.setAttribute(link, 'href', dep);
dom5.append(head, link);
}
contents = dom5.serialize(ast);
file.contents = new Buffer(contents);
}示例10: _injectHtmlImportsForBundle
/**
* Add HTML Import elements for each file in the bundle. Efforts are made
* to ensure that imports are injected prior to any eager imports of other
* bundles which are known to depend on them, to preserve expectations of
* evaluation order.
*/
private _injectHtmlImportsForBundle(ast: ASTNode) {
// Gather all the document's direct html imports. We want the direct (not
// transitive) imports only here, because we'll be using their AST nodes
// as targets to prepended injected imports to.
const existingImports = [
...this.document.getFeatures(
{kind: 'html-import', noLazyImports: true, imported: false})
].filter((i) => !i.lazy && i.document !== undefined);
const existingImportDependencies = new Map<ResolvedUrl, ResolvedUrl[]>();
for (const {url, document} of existingImports) {
existingImportDependencies.set(
url,
[...document!.getFeatures({
kind: 'html-import',
imported: true,
noLazyImports: true,
})].filter((i) => i.lazy === false && i.document !== undefined)
.map((i) => i.document!.url));
}
// Every HTML file in the bundle is a candidate for injection into the
// document.
for (const importUrl of this.assignedBundle.bundle.files) {
// We only want to inject an HTML import to an HTML file.
if (getFileExtension(importUrl) !== '.html') {
continue;
}
// We don't want to inject the bundle into itself.
if (this.assignedBundle.url === importUrl) {
continue;
}
// If there is an existing import in the document that matches the
// import URL already, we don't need to inject one.
if (existingImports.find(
(e) =>
e.document !== undefined && e.document.url === importUrl)) {
continue;
}
// We are looking for the earliest eager import of an html document
// which has a dependency on the html import we want to inject.
let prependTarget = undefined;
// We are only concerned with imports that are not of files in this
// bundle.
for (const existingImport of existingImports.filter(
(e) => e.document !== undefined &&
!this.assignedBundle.bundle.files.has(e.document.url))) {
// If the existing import has a dependency on the import we are
// about to inject, it may be our new target.
if (existingImportDependencies.get(existingImport.document!.url)!
.indexOf(importUrl) !== -1) {
const newPrependTarget = dom5.query(
ast, (node) => isSameNode(node, existingImport.astNode));
// IF we don't have a target already or if the old target comes
// after the new one in the source code, the new one will replace
// the old one.
if (newPrependTarget &&
(!prependTarget ||
inSourceOrder(newPrependTarget, prependTarget))) {
prependTarget = newPrependTarget;
}
}
}
// Inject the new html import into the document.
const relativeImportUrl = this.bundler.analyzer.urlResolver.relative(
this.assignedBundle.url, importUrl);
const newHtmlImport = this._createHtmlImport(relativeImportUrl);
if (prependTarget) {
dom5.insertBefore(
prependTarget.parentNode!, prependTarget, newHtmlImport);
} else {
const hiddenDiv = this._findOrCreateHiddenDiv(ast);
dom5.append(hiddenDiv.parentNode!, newHtmlImport);
}
}
}