Question

我需要将另一个HTML文件导入HTML文件。我尝试了三种不同的设置，下面链接，没有一个正确显示。我很感激任何帮助解决这个问题。对于那些想知道我为什么要这样做的人，HTML和其他链接文件是使用经常上传并写入旧文件的程序创建的，我想这样做，所以我可以更改字体而无需重做每次上传新副本。

以下是这些链接：jaredcaputo.photography/1/index2.html,jaredcaputo.photography/1/index22.html,jaredcaputo.photography/1/index222.html

索引2：

    <html>
  <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script>
    $(function(){
      $("#includedContent").load("index.html");
    });
    </script>
  </head>

<script>
    var LR = LR || {};
</script>

<link rel="stylesheet" type="text/css" href="assets/css/normalize.css">
        <link rel="stylesheet" type="text/css" href="assets/css/main.css">
        <link rel="stylesheet" type="text/css" media="screen" title="Custom Settings" href="assets/css/custom.css" >

  <body>
     <div id="includedContent"></div>
  </body>

</html>

索引22：

<head>
  <link rel="import" href="index.html">
</head>

索引222：

<!DOCTYPE html>
<html>
<script src="http://www.w3schools.com/lib/w3data.js"></script>

<body>

<div w3-include-html="index.html"></div>

<script>
w3IncludeHTML();
</script>

</body>
</html>

我要导入的文件是jaredcaputo.photography/1/index.html

非常感谢！

Answer 1

AJAX通常用于此。将它放在要导入INTO的两个页面的顶部：

var aws = require('aws-sdk')
var express = require('express')
var multer = require('multer')
var multerS3 = require('multer-s3')

var app = express()
var s3 = new aws.S3({ {accessKeyId: 'akid', secretAccessKey: 'secret'}) 
//this can also be configured in config file and through code



var upload = multer({
  storage: multerS3({
    s3: s3,
    bucket: 'some-bucket',
    key: function (req, file, cb) {
      cb(null, Date.now().toString())
    }
  })
})

//the upload.array -means that you can load multiple files(max 3) named photos maximum 3,  the resulting AWS full path urls will be returned in req.files 
app.post('/upload', upload.array('photos', 3), function(req, res, next) {
  //reference results that can be stored in database for example in req.files
  res.send('Successfully uploaded ' + req.files.length + ' files!')
})

它只是获取并将index2.html文件附加到当前页面的主体上。

Answer 2

示例工作正常，页面显示在DOM中，唯一的部分是页面正文，因为您试图将import React, { StyleSheet, Text, TextInput, View } from "react-native"; import dismissKeyboard from "dismissKeyboard"; export default class NoteScreen extends React.Component { render() { handleTitleEditingEnd = (text) => { this.refs.body.focus(); }; return ( <View style={styles.container}> <View style={styles.inputContainer}> <TextInput ref="title" placeholder="Untitled" style={[styles.textInput, styles.title]} onEndEditing={handleTitleEditingEnd} returnKeyType="next" /> </View> <View style={styles.inputContainer}> <TextInput ref="body" multiline={true} placeholder="Start typing" style={[styles.textInput, styles.body]} /> </View> </View> ); } } const styles = StyleSheet.create({ container: { flex: 1, justifyContent: "center", // alignItems: "center", marginTop: 64 }, inputContainer: { borderBottomColor: "#9E7CE3", borderBottomWidth: 1, flexDirection: "row", marginBottom: 10, flex: 1, }, textInput: { flex: 1, fontSize: 16, }, title: { height: 40, }, body: { flex: 1, } });元素放在{{1另一个页面已经有<body>。

您需要将嵌入的文档修改为不具有head和body标记的HTML文档，或者您需要使用IFrame来允许子内容拥有自己的DOM。

Answer 3

为什么不按HTML imports？

中所述使用Web Components spec

如果您关注浏览器兼容性，还可以polyfill here，您可以了解enter image description here。

用于导入另一个无法正确显示的HTML文件的HTML

3 个答案: