uc-browser 相关问题


下载期间出错:“NoneType”对象没有属性“groups”

我无法从我的谷歌驱动器下载音频文件。 导入gdown drive_link = 'https://drive.google.com/uc?id=1X13DtRGrF2gFVYL_2bVZ9OtiuSQGnl' file_id =drive_link.split('=')[1] 输出_pat...


SeleniumBase 和 Datadome

我正在尝试(仍然)在 UC 模式下使用 SeleniumBase 克服 datadome 检测。我以为我已经有了它,但似乎 datadome 正在发展,现在让我输入验证码,在我滑动 ji 之后...


下面的Browser Engine图和JS Runtime图之间的桥梁是什么?

我一直在阅读有关浏览器如何工作以及浏览器的组件是什么的内容。我看到了各种关于浏览器如何解析 JS 和渲染过程等的文章,但我不是


为什么现在无法播放 gdrive 文件中的音频?

我有这样的代码: 我有这样的代码: <audio id="player" autoplay controls> <source src="http://docs.google.com/uc?export=open&id=107VpNA7BU4AIxVsK2sRg69-rOigdU57n" type="audio/mp3"> </audio> 最初,上面的代码应该播放驱动器上文件中的歌曲。但是,由于某种原因,它不再起作用了。有人遇到过类似问题吗 听起来您面临着 HTML 的限制,不允许直接从 Google Drive 上的文件流式传输音乐。一种解决方法可能是将音乐文件托管在允许直接流式传输的服务器上,或者您可以考虑使用支持此功能的不同平台或技术。您需要帮助寻找替代解决方案或平台吗? Google 云端硬盘不支持直接流式传输。 您可以尝试使用 Dropbox OP的方法实际上确实适用于从谷歌驱动器传输音频,使用; src="http://docs.google.com/uc?export=open&id=file-id", 直到 2024 年 1 月 10 日左右。 在上述日期之前,我有几个 html/javascript 网络播放器直接从驱动器流式传输我的音乐。 Google 已开始推出影响第三方访问驱动器文件方式的更改;意思是在drive.google.com之外 来自 Google Drive 服务器之外的文件请求不再受到相同的处理。 下面链接中的答案部分解释了问题: https://stackoverflow.com/a/77805668/23238731 虽然这个答案是参考谷歌驱动器中的图像,但这同样适用于像OP代码一样链接的音频文件。 Google 建议用户现在使用 iframe 以 html 形式显示 google 云端硬盘内容,包括音频。 我已经对此进行了测试,iframe 选项确实适用于音频,尽管它对于流媒体没有用。


使用 JavaScript 以 HTML 形式显示 Google 云端硬盘中的图像时遇到问题

我正在努力使用 JavaScript 在我的 HTML 页面上显示来自 Google Drive 的图像。遵循在线指南并没有完全解决我的问题。 HTML(索引.html): 我正在努力使用 JavaScript 在我的 HTML 页面上显示来自 Google 云端硬盘的图像。遵循在线指南并没有完全解决我的问题。 HTML(index.html): <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Google Drive Image</title> </head> <body> <img id="imageElement" alt="A lovely image"> <script src="script.js"></script> </body> </html> JavaScript(script.js): const fileId = '1BEW9tkgVKlp_ebUc17LkXDH-mnPc4ome'; const imageElement = document.getElementById('imageElement'); async function fetchGoogleDriveImage(fileId) { try { const response = await fetch(`https://drive.google.com/uc?id=${fileId}`); const url = URL.createObjectURL(await response.blob()); imageElement.src = url; } catch (error) { console.error('Error fetching the image:', error); } } fetchGoogleDriveImage(fileId); 背景: Google 云端硬盘中的图像设置为“知道链接的任何人都可以查看。” 尽管如此,图像仍无法在浏览器中加载,并且控制台显示错误。 附加HTML(纯html): <body> <img src="https://drive.google.com/uc?id=1BEW9tkgVKlp_ebUc17LkXDH-mnPc4ome" alt="Your Image Alt Text"> </body> CodePen 示例 如有任何帮助,我们将不胜感激!谢谢。 虽然没有在任何地方发布(我发现),但 Google Drive 的服务器已开始拒绝附加这两个标头的请求: sec-fetch-mode: no-cors sec-fetch-site: cross-site 如果您将浏览器直接导航到文件的(直接链接)URL(即获取您的src URL并将其粘贴到浏览器导航栏中),但该请求期间的sec-fetch-mode标头将是设置为 navigate 并且效果很好。 但是,与您的 <img> 示例一样,如果请求源是网页,并且与 drive.google.com 来源不同,就会出现问题。 (您的浏览器将自动将这些 sec-fetch-mode 和 sec-fetch-site 标头设置为请求的一部分。) 这似乎是 Google Drive 自 2024 年 1 月 10 日开始的一项未记录的更改,我仍然找不到任何提及它的地方,因此尚不清楚此行为是否会持续存在,或者是否反映了意外更改或疏忽。 我也有同样的问题。临时解决办法是使用大宽度的驱动器文件缩略图 您正在此处执行所有操作,看来问题出在 Google 端,并于今天开始发生(撰写本文时为 2024 年 1 月 11 日)。 Google 可能会解决此问题并允许直接图像嵌入,或者他们可能会继续阻止它,这意味着您必须找到另一种方式来托管网站图像,例如 S3。 (可能)此处跟踪错误:https://issuetracker.google.com/issues/319531488?pli=1 我开始在 HTML 中链接 css 文件时遇到同样的问题。


NG8001:“app-welcome”不是已知元素:

我的 Angular 应用程序遇到问题,收到错误 8001。我不知道如何处理它。谁能帮我这个?谢谢你! 应用程序组件.html {{标题}}&l... 我的 Angular 应用程序遇到问题,收到错误 8001。我不知道如何处理它。谁能帮我这个?谢谢! app.component.html <h1>{{ title }}</h1> <p>Congratulations! Your app is running. 🎉</p> <app-welcome></app-welcome> app.component.ts import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterOutlet } from '@angular/router'; @Component({ selector: 'app-root', standalone: true, imports: [CommonModule, RouterOutlet], templateUrl: './app.component.html', styleUrl: './app.component.css' }) export class AppComponent { title = 'XYZCARS'; } welcome.component.ts import { Component } from '@angular/core'; @Component({ selector: 'app-welcome', templateUrl: './welcome.component.html', styleUrl: './welcome.component.css' }) export class WelcomeComponent { car = 'toyota'; } 我的项目最初没有 app.module.ts 文件。我自己添加了它并根据网上找到的一些信息进行了配置,但问题仍然存在并且仍未解决。谁能帮我解决这个问题吗? app.module.ts import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { WelcomeComponent } from './welcome/welcome.component'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent, WelcomeComponent ], imports: [ BrowserModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } 如果您正在 Angular 17 中创建项目->使用这些命令 ng app --no-standalone 然后你就得到了 app.module.ts 文件。


如果类型是从变量进行数据绑定,则通过 <object> 标签在 Angular 中显示 pdf 无法在 Chrome 中工作

我正在尝试通过 标签在 Chrome 中显示 pdf。 如果我手动编写类型,它会起作用: 不工作 但是... 我正在尝试通过 <object> 标签在 Chrome 中显示 pdf。 如果我手动写 type: 就可以了 <object [data]="getUrl(true)" type="application/pdf"> Not working </object> 但如果我从变量读取类型则不会: <object [data]="getUrl(true)" [type]="file.mimeType"> Not working </object> 为什么?这是一些非常奇怪的错误,还是我做错了什么可怕的事情。 这里是plunkr。 它可以在 Firefox 中运行(所有 4 个对象都会显示),但不能在 Chrome 中运行 (Version 74.0.3729.169 (Official Build) (64-bit)): 我遇到了同样的问题,但我不明白原因。 就我而言,我决定在基于 Blink 引擎的浏览器中使用“embed”元素而不是“object”元素。 <ng-template #blinkPlatformViewer> <embed [src]="getUrl(true)" [type]="file.mimeType"/> </ng-template> <object *ngIf="!isBlinkPlatform; else blinkPlatformViewer" [data]="getUrl(true)" [type]="file.mimeType"> Not working </object> import { Platform } from '@angular/cdk/platform'; import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'; export class FileContentComponent { constructor(private readonly sanitizer: DomSanitizer, private readonly platform: Platform) { } get isBlinkPlatform(): boolean { return this.platform.BLINK; } }


ESLint:解析错误:意外的标记:

大家好我正在将我的 vue3 项目从 js 迁移到 typescript,我遇到了这个问题: 这是我在 .vue 文件中的代码 const toto = (msg: string) => { </desc> <question vote="7"> <p>大家好,我正在将我的 vue3 项目从 js 迁移到 typescript,我遇到了这个问题:</p> <p><a href="https://i.stack.imgur.com/y5tG8.png" target="_blank"><img src="https://cdn.txt58.com/i/AWkuc3RhY2suaW1ndXIuY29tL3k1dEc4LnBuZw==" alt=""/></a></p> <p>这是我在 .vue 文件中的代码</p> <pre><code>&lt;script setup lang=&#34;ts&#34;&gt; const toto = (msg: string) =&gt; { console.log(msg) } &lt;/script&gt; </code></pre> <p>这是我的 eslintrc.js</p> <pre><code>module.exports = { &#39;env&#39;: { &#39;browser&#39;: true, &#39;es2021&#39;: true }, &#39;extends&#39;: [ &#39;eslint:recommended&#39;, &#39;plugin:vue/vue3-essential&#39; ], &#39;parserOptions&#39;: { &#39;ecmaVersion&#39;: 13, &#39;sourceType&#39;: &#39;module&#39; }, &#39;plugins&#39;: [ &#39;vue&#39; ], &#39;rules&#39;: { &#39;vue/multi-word-component-names&#39;: &#39;off&#39;, &#39;vue/object-curly-spacing&#39;: [2, &#39;always&#39;], &#39;vue/html-closing-bracket-spacing&#39;: [2, { &#39;selfClosingTag&#39;: &#39;always&#39; }], &#39;vue/max-attributes-per-line&#39;: [2, { &#39;singleline&#39;: { &#39;max&#39;: 1 }, &#39;multiline&#39;: { &#39;max&#39;: 1 } }], &#39;semi&#39;: [2, &#39;never&#39;] } } </code></pre> </question> <answer tick="true" vote="10"> <p>您需要配置 eslint 以支持 typescript,因为 eslint 不支持开箱即用。 首先,您需要安装<a href="https://www.npmjs.com/package/@typescript-eslint/parser" rel="nofollow noreferrer">@typescript-eslint/parser</a>,然后安装<a href="https://www.npmjs.com/package/@typescript-eslint/eslint-plugin" rel="nofollow noreferrer">@typescript-eslint/eslint-plugin</a>。 安装完这些后,请按如下方式更新您的配置 - </p> <pre><code>module.exports = { &#39;env&#39;: { &#39;browser&#39;: true, &#39;es2021&#39;: true, node: true }, &#39;extends&#39;: [ &#39;eslint:recommended&#39;, &#39;plugin:vue/vue3-essential&#39; ], &#39;parserOptions&#39;: { &#39;ecmaVersion&#39;: 12, &#39;sourceType&#39;: &#39;module&#39;, parser: &#39;@typescript-eslint/parser&#39; }, &#39;plugins&#39;: [ &#39;vue&#39;, &#39;@typescript-eslint&#39; ], &#39;rules&#39;: { &#39;vue/multi-word-component-names&#39;: &#39;off&#39;, &#39;vue/object-curly-spacing&#39;: [2, &#39;always&#39;], &#39;vue/html-closing-bracket-spacing&#39;: [2, { &#39;selfClosingTag&#39;: &#39;always&#39; }], &#39;vue/max-attributes-per-line&#39;: [2, { &#39;singleline&#39;: { &#39;max&#39;: 1 }, &#39;multiline&#39;: { &#39;max&#39;: 1 } }], &#39;semi&#39;: [2, &#39;never&#39;] } } </code></pre> </answer> <answer tick="false" vote="1"> <p>就我而言,问题是我使用解析器选项作为数组,而不是字符串:</p> <pre><code> parserOptions: { - parser: [&#39;@typescript-eslint/parser&#39;], + parser: &#39;@typescript-eslint/parser&#39;, }, </code></pre> </answer> <answer tick="false" vote="0"> <p>如果你在项目中同时使用 JS 和 TS,此配置有帮助</p> <pre><code> overrides: [ { files: [&#39;*.vue&#39;], parser: &#39;svelte-eslint-parser&#39;, parserOptions: { parser: { // Specify a parser for each lang. ts: &#39;@typescript-eslint/parser&#39;, js: &#39;espree&#39;, typescript: &#39;@typescript-eslint/parser&#39; } } } ], </code></pre> </answer> <answer tick="false" vote="-1"> <p>我在节点 v12.22.9 上遇到了这个问题。通过升级到 v14.21.2,我不再遇到解析错误。您可以使用命令升级/安装</p> <pre><code>nvm install v14.21.2 </code></pre> </answer> </body></html>


选中/取消选中 mat-checkbox 未正确返回 true 或 false

我正在使用 Angular 15 和 Angular Material 14,下面是我用来显示复选框列表的 HTML 代码 我正在 Angular 15 和 Angular Material 14 工作,下面是我用来显示复选框列表的 HTML 代码 <div *ngFor="let control of checkboxArray.controls;let i = index" > <mat-checkbox [formControl]="control" (input)="validateInputs(notificationForm)" [checked]="control.value" (change)="control.checked=$event.checked;onCheckedChange(i);"> {{ checkboxItems[i].name }} </mat-checkbox> </div> 下面是Angular中onCheckedChange函数的代码 onCheckedChange(index: number) { this.sortCheckboxArray(); const checkboxItem = this.checkboxItems[index]; const control = this.checkboxArray.at(index); if (control) { if (control.value) { this.lists.push(checkboxItem.id.toString()); } else { this.lists.pop(checkboxItem.id.toString()); } } this.updateSubscriberGroupsCount(); this.cdr.detectChanges(); } 当我选中复选框时,在这个 onCheckedChange 函数中,control.value 始终返回 false。哪里出了问题?无法理解.. 这是一个工作版本,复选框逻辑工作正常,希望有帮助! 我们需要使用control.value获取表单组,但我们还需要访问内部表单控件,然后获取复选框值! import { CommonModule } from '@angular/common'; import { Component } from '@angular/core'; import { FormArray, FormControl, FormGroup, ReactiveFormsModule, } from '@angular/forms'; import { bootstrapApplication } from '@angular/platform-browser'; import 'zone.js'; import { MatCheckboxModule } from '@angular/material/checkbox'; @Component({ selector: 'app-root', standalone: true, imports: [CommonModule, ReactiveFormsModule, MatCheckboxModule], template: ` <form [formGroup]="form"> <div formArrayName="array"> <div *ngFor="let control of checkboxArray.controls;let i = index" [formGroupName]="i"> <mat-checkbox formControlName="test" style="margin-bottom: 15px;" (change)="onCheckedChange(i);"> {{ checkboxItems[i].name }} </mat-checkbox> </div> </div> </form> `, }) export class App { name = 'Angular'; form = new FormGroup({ array: new FormArray([]), }); lists = []; checkboxItems: any = []; ngOnInit() { this.add(); this.add(); this.add(); } add() { this.checkboxArray.push( new FormGroup({ test: new FormControl(false), }) ); this.checkboxItems.push({ name: 'test' }); } get checkboxArray() { return this.form.get('array') as FormArray; } onCheckedChange(index: number) { // this.sortCheckboxArray(); // const checkboxItem = this.checkboxItems[index]; const control = this.checkboxArray.at(index); if (control) { if (control.value.test) { console.log('checked'); // this.lists.push(checkboxItem.id.toString()); } else { console.log('not checked'); // this.lists.pop(checkboxItem.id.toString()); } } // this.updateSubscriberGroupsCount(); // this.cdr.detectChanges(); } } bootstrapApplication(App); 堆栈闪电战


使用python的mechanize自动网站登录

我正在尝试自动登录一个网站,该网站的登录表单具有以下 HTML 代码(摘录): 我正在尝试自动登录一个网站,其登录表单具有以下 HTML 代码(摘录): <tr> <td width="60%"> <input type="text" name="username" class="required black_text" maxlength="50" value="" /> </td> <td> <input type="password" name="password" id="password" class="required black_text" maxlength="50" value="" /> </td> <td colspan="2" align="center"> <input type="image" src="gifs/login.jpg" name="Login2" value="Login" alt="Login" title="Login"/> </td> </tr> 我正在使用python的mechanize模块进行网页浏览。以下是代码: br.select_form(predicate=self.__form_with_fields("username", "password")) br['username'] = self.config['COMMON.USER'] br['password'] = self.config['COMMON.PASSWORD'] try: request = br.click(name='Login2', type='image') response = mechanize.urlopen(request) print response.read() except IOError, err: logger = logging.getLogger(__name__) logger.error(str(err)) logger.debug(response.info()) print str(err) sys.exit(1) def __form_with_fields(self, *fields): """ Generator of form predicate functions. """ def __pred(form): for field_name in fields: try: form.find_control(field_name) except ControlNotFoundError, err: logger = logging.getLogger(__name__) logger.error(str(err)) return False return True return __pred 不知道我做错了什么...... 谢谢 该网站有可能在登录期间使用java脚本进行回发。我记得很清楚,对于 ASP .Net 站点,您需要获取隐藏表单字段,例如 VIEWSTATE 和 EVENTTARGET 并将它们发布到新 Page 。 您为什么不发送问题网站的链接?之后就变得相对容易弄清楚了 尝试使用 Selenium 和 PhantomJS from selenium import PhantomJS import platform if platform.system() == 'Windows': # .exe for Windows PhantomJS_path = './phantomjs.exe' else: PhantomJS_path = './phantomjs' service_args = [ # Proxy (optional) '--proxy=<>', '--proxy-type=http', '--ignore-ssl-errors=true', '--web-security=false' ] browser = PhantomJS(PhantomJS_path, service_args=service_args) browser.set_window_size(1280, 720) # Window size for screenshot (optional) login_url = "<url_here>" # Credentials Username = "<insert>" Password = "<insert>" # Login browser.get(login_url) browser.save_screenshot('login.png') print browser.current_url browser.find_element_by_id("<username field id>").send_keys(Username) browser.find_element_by_id("<password field id>").send_keys(Password) browser.find_element_by_id("<login button id>").click() print (browser.current_url) browser.get(scrape_url) print browser.page_source browser.quit() ''' python 和 pycharm 设置路径变量 点维辛检查 包管理器 python 如何安装新版本 python最新版本 - python 3.7.2 用户环境变量 蟒蛇 pyton 中的命令行 '''


带有使用 requireJS 的 javascript 模块的 Flutter Web 项目(Flutter Web 中的 Monaco 编辑器)

我正在尝试在 Flutter Web 中使用 Monaco 编辑器。 我看到的最简单的方法是同步加载所有资源示例。 这是一个独立的 html 文件: 我正在尝试在 Flutter Web 中使用 Monaco 编辑器。 我看到的最简单的方法是同步加载所有资源示例。 这是一个独立的 html 文件: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" data-name="vs/editor/editor.main" href="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs/editor/editor.main.css" /> <style> @font-face { font-family: "codicon", src: url("https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs/base/browser/ui/codicons/codicon.ttf") format("truetype") } </style> <title>Monaco</title> </head> <body> <h2>Monaco Editor Sync Loading Sample</h2> <div id="code" style="width: 800px; height: 600px; border: 1px solid grey"></div> <script> var require = { paths: { vs: "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs" } }; </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs/loader.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs/editor/editor.main.nls.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs/editor/editor.main.js"></script> <script> var editor = monaco.editor.create(document.getElementById("code"), { value: ['function x() {', '\tconsole.log("Hello world!");', '}'].join('\n'), language: "javascript", additionalCssClassName: "code" }); </script> </body> </html> 我的问题是:如何修改示例 Flutter Web 项目的 index.html 文件,以便加载所有必需的资源?线路好像有问题 var require = { paths: { vs: "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.44.0/min/vs" } }; 因为 flutter 构建永远不会完成(卡在某个地方。)我看到 Flutter 本身使用 requirejs,并且可能存在我不知道如何解决的冲突。 如果您知道如何执行此操作,请发布一个 Fluter Web index.html 文件,该文件加载编辑器所需的所有 js 文件。 谢谢你, T https://github.com/Hua777/flutter_monaco_editor 我已经大致完成了flutter版的monaco编辑器。 但还不完美,希望对你有帮助。


在 HTML 文档中嵌入 TypeScript 代码

是否可以在网页中嵌入 TypeScript 代码?我想将 TypeScript 代码嵌入到脚本标签中,如下所示(以便它自动编译为 Javascript): <p>是否可以在网页中嵌入 TypeScript 代码?我想将 TypeScript 代码嵌入到脚本标签中,如下所示(以便它自动编译为 Javascript):</p> <pre><code>&lt;script type = &#34;text/typescript&#34;&gt; //TypeScript code goes here &lt;/script&gt; </code></pre> </question> <answer tick="true" vote="28"> <p>实际上有几个项目允许您使用类似的 TypeScript 代码 - <a href="https://github.com/niutech/typescript-compile" rel="noreferrer">TypeScript Compile</a>、<a href="https://github.com/ComFreek/ts-htaccess" rel="noreferrer">ts-htaccess</a>。</p> <p>这里的问题是 .ts 代码应该编译成 JavaScript - 它可以在客户端完成(速度慢;整个 TSC 也应该加载到客户端)或在服务器端完成(显然更快,而且它更快)在编译代码上利用缓存要容易得多)。</p> </answer> <answer tick="false" vote="18"> <p>这是我编写的版本,<strong>直接</strong>使用 Microsoft/TypeScript/master 的版本,因此它始终保持最新:<a href="https://github.com/basarat/typescript-script" rel="noreferrer">https://github.com/basarat/typescript-script</a></p> <p>您甚至可以将 <pre><code>ts</code></pre> 指向您可能拥有的任何其他 TypeScript 版本,它会正常工作 🌹</p> </answer> <answer tick="false" vote="6"> <p>已经为此目的开发了一个 JavaScript 库 - 它称为 <a href="https://github.com/niutech/typescript-compile" rel="noreferrer">TypeScript Compile</a>,它允许将 Typescript 嵌入到 HTML 中(如上所示。)</p> </answer> <answer tick="false" vote="0"> <p>我写这篇文章的目的是为了在浏览器中编译 TypeScript,以便我可以编写快速简单的示例来分享。</p> <p><a href="https://github.com/Sean-Bradley/text-typescript" rel="nofollow noreferrer">https://github.com/Sean-Bradley/text-typescript</a></p> <p>使用,</p> <pre><code>&lt;script type=&#34;text/typescript&#34;&gt; // Your TypeScript code here &lt;/script&gt; </code></pre> <p>并包含依赖项。</p> <pre><code>&lt;script src=&#34;https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" data-cfemail="67131e17021404150e1713275249544954">[email protected]</a>&#34;&gt;&lt;/script&gt; &lt;script defer src=&#34;https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" data-cfemail="3743524f431a434e47524454455e4743770619041907">[email protected]</a>&#34;&gt;&lt;/script&gt; </code></pre> <p>一个完整的示例,您可以复制/粘贴到 HTML 文档中并在本地尝试。</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang=&#34;en&#34;&gt; &lt;head&gt; &lt;meta charset=&#34;utf-8&#34; /&gt; &lt;meta name=&#34;viewport&#34; content=&#34;width=device-width, initial-scale=1&#34; /&gt; &lt;title&gt;&#34;text/typescript&#34; example&lt;/title&gt; &lt;meta name=&#34;description&#34; content=&#34;Transpiling and executing TypeScript in the browser&#34; /&gt; &lt;style&gt; body { overflow: hidden; margin: 0px; font-size: 15vw; } &lt;/style&gt; &lt;script type=&#34;text/typescript&#34;&gt; function foo(bar: string) { return &#34;Hello &#34; + bar; } let baz = &#34;World!&#34;; document.getElementById(&#34;root&#34;).innerHTML = foo(baz); &lt;/script&gt; &lt;script src=&#34;https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" data-cfemail="13676a63766070617a636753263d203d20">[email protected]</a>&#34;&gt;&lt;/script&gt; &lt;script defer src=&#34;https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" data-cfemail="ec98899498c198959c899f8f9e859c98acddc2dfc2dc">[email protected]</a>&#34;&gt;&lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div id=&#34;root&#34;&gt;&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>你可以看到它在这里、现在、今天发挥作用。</p> <p><a href="https://editor.sbcode.net/f1f4b5a73ec40283d1ddb37bb1e71f7e4e31b487" rel="nofollow noreferrer">https://editor.sbcode.net/f1f4b5a73ec40283d1ddb37bb1e71f7e4e31b487</a></p> </answer> </body></html>


© www.soinside.com 2019 - 2024. All rights reserved.