javascript - Bagaimana untuk memindahkan secara langsung sebahagian daripada kandungan laman web lain?

Question

Mungkin penerangan masalah tidak begitu jelas, contohnya, saya ingin menyalin keseluruhan SF

Saya meletakkan sekeping HMTL ini ke dalam tapak web saya Jika SF dikemas kini, saya juga akan dikemas kini, dan bolehkah ia kekal boleh diklik?
Atau bolehkah saya hanya melaksanakannya dengan menulis perangkak untuk merangkak dan menaipnya sendiri?

Answer 1

Memandangkan subjek ingin menggunakan pelaksanaan proksi, saya menggunakan NodeJSlapisan tengah sebagai proksi di sini untuk mencapai keperluan subjek.

Prinsip pelaksanaan

Tambah lapisan tengah NodeJS pada projek untuk mendapatkan kandungan halaman web SF dalam masa nyata Bahagian hadapan menggunakan Ajax untuk meminta lapisan tengah ini mendapat HTML SF dan mengembalikannya ke bahagian hadapan dalam bentuk a rentetan, dan akhirnya mengikatnya ke DOM. Ringkasnya, ia adalah menggunakan pelayan untuk merangkak kandungan halaman web SF dan mengembalikannya ke bahagian hadapan.

Idea pelaksanaan

Anda boleh menggunakan rangka kerja ExpressJS, sila semak dokumentasi rasmi untuk penggunaan khusus.

Kod pelayan:

var express = require('express');
var app = express();
var request = require('request');

//定义路由，供前端ajax调用
app.get('/sf', function(req, res, next) {
  //请求sf网页内容
  request({url: req.query.url, encoding : null}, function(err, response, body) {
    if (!err && response.statusCode == 200) {
      req.body.sfHtml = res.body;
    }
  });
  next();
}, function (req, res) {
  //获取到返回值之和以json的形式返回给前端
  res.json({sfHtml: req.body.sfHtml});
});

//启动服务
app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

Kod bahagian hadapan adalah lebih mudah:

$(document).ready(function(){
  $.ajax({
      url:"/sf?url=http://sfurl.cn",
      success: function(res){
          //这里拿到Node服务端返回的sf html内容
          console.info(res.sfHtml);
      }
  });
});

Akhirnya

Di atas hanya memberikan idea pelaksanaan yang mudah Untuk situasi tertentu, sila buat pelarasan mengikut senario teknikal anda sendiri Jika anda menggunakan bahasa sebelah pelayan yang lain, anda juga boleh menggunakan idea ini untuk merealisasikan keperluan penyoal.

Answer 2

Beberapa cara

Pertama, anda boleh menggunakan beban jQuery dan pilih bahagian id yang diperlukan sahaja

$('#目标位置id').load('http://www.mywebsite.com/portfolio.php #需要的内容id');

Kedua, anda boleh menggunakan iframe dan kemudian menggunakan nilai negatif margin-atas untuk mengehadkan bahagian atas, ketinggian untuk mengehadkan bahagian bawah dan menatal="no" untuk melumpuhkan penatalan. Kaedah ini sesuai untuk bahagian tengah.

<p style="border: 3px solid rgb(201, 0, 1); overflow: hidden; margin: 15px auto; max-width: 736px;">
<iframe scrolling="no" src="http://www.w3schools.com/css/default.asp" style="border: 0px none; margin-left: -185px; height: 859px; margin-top: -533px; width: 926px;">
</iframe>
</p>

Yang ketiga ialah menggunakan js untuk mengeluarkan bahagian yang diperlukan selepas mengeluarkan iframe. Ini sesuai apabila hanya sebahagian kecil daripadanya diperlukan.

Sembunyikan selepas perahan

<p id="PlaceToPutTable"></p>
<iframe id="iframe" src="urlofpagewithtableonit.html" style="display:hidden;"></iframe>

Pilih bahagian yang anda perlukan

var iframe = document.getElementById("iframe");
var p = document.getElementById("PlaceToPutTable");
p.innerHTML = iframe.contentWindow.document.getElementById("KnowpName").innerHTML;

Lihat: https://stackoverflow.com/que...
https://stackoverflow.com/que...

Answer 3

Jika ia tertanam semata-mata, anda boleh menggunakan iframe+CSS/JS teknologi hitam untuk mengalih keluar elemen lain yang tidak berkaitan dan hanya memaparkan yang ini sahaja.
Jika anda ingin menulisnya sepenuhnya ke dalam laman web anda sendiri, anda hanya boleh menaipnya sendiri.