2010-11-19 56 views
18

Ngày tốt lành.Tải nội dung trang về biến số

Tôi chưa bao giờ thực sự nắm bắt được JavaScript, do đó câu hỏi không bình thường và đơn giản này.

Làm cách nào để tải nội dung trang lên biến JavaScript, với số lượng mã ít nhất, không có khuôn khổ và ít tác động hơn đến hiệu suất?

Cảm ơn.


EDIT

kẻ Xin lỗi. Tôi quên đề cập đến: Lấy nội dung trang từ url được chỉ định đến một biến JS.


Sau BrendanSuggestion

tôi đã nhìn thấy Brendan thay thế ở nơi khác và thử nó, nhưng nó đã không làm việc vào thời điểm đó, và nó không hoạt động ngay bây giờ. Trong khi đó Firebug và các trình duyệt được kiểm tra (IE8 và FF) không báo cáo bất kỳ lỗi nào. Vì vậy những gì là sai?

+0

Giúp chúng tôi ra - Bạn có nghĩa là nội dung của trang hiện tại? – Basic

+1

Nếu bạn muốn truy cập một trang khác, điều này có thể hữu ích: http://www.xul.fr/ajax/responseHTML-attribute.html – rsideb

Trả lời

12

Đây là phiên bản được sửa đổi của ví dụ bạn có thể tìm thấy tại w3schools.com.

<script type="text/javascript"> 
    function loadXMLDoc(theURL) 
    { 
     if (window.XMLHttpRequest) 
     {// code for IE7+, Firefox, Chrome, Opera, Safari, SeaMonkey 
      xmlhttp=new XMLHttpRequest(); 
     } 
     else 
     {// code for IE6, IE5 
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
      if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       alert(xmlhttp.responseText); 
      } 
     } 
     xmlhttp.open("GET", theURL, false); 
     xmlhttp.send(); 
    } 
</script> 

Vì vậy, chỉ cần đảm "example.html" được bất kỳ loại đường dẫn (tương đối hoặc tuyệt đối) đến trang mà bạn muốn tải, và xmlhttp.responseText sẽ là một chuỗi chứa nội dung trả lời. Bạn cũng có thể sử dụng xmlhttp.responseXML nếu bạn muốn nó được lưu trữ dưới dạng tài liệu XML đi ngang. Dù sao, chỉ cần gán một trong những người cho một biến của sự lựa chọn của bạn, và bạn sẽ có nó! Lưu ý rằng 'loadXMLDoc' không trả về bất kỳ điều gì trực tiếp nhưng xác định một trong các thành viên của nó ('onreadystatechange') để thực hiện công việc đó và chỉ thực hiện trong điều kiện nhất định (readyState và trạng thái). Kết luận - không gán đầu ra của hàm này cho bất kỳ var nào. Thay vì làm điều gì đó như:

var xmlhttp=false; 
loadXMLDoc('http://myhost/mycontent.htmlpart'); 
if(xmlhttp==false){ /* set timeout or alert() */ } 
else { /* assign `xmlhttp.responseText` to some var */ } 

Nếu không có điều đó, tất cả người ta có thể thấy được 'undefined' ...

+0

Tôi đã thử điều đó, với http: //google.com thay thế. Không may mắn, không có lỗi giao diện điều khiển. –

+2

Lưu ý rằng URL phải nằm trong cùng một miền nếu không bạn sẽ nhận được các lỗi bảo mật (đó là lý do tại sao google.com không hoạt động). Xem thông số kỹ thuật tại đây: http://www.w3.org/TR/XMLHttpRequest/#the-open-method – WSkid

+0

@WSkid: Cảm ơn. Tôi không biết điều đó, vì vậy làm thế nào tôi có thể sử dụng nó cho các url bên ngoài miền của tôi? –

11

Để có được tất cả mọi thứ bên trong các thẻ html:

var html = document.getElementsByTagName('html')[0]; 
var text = html.innerHTML; 

Sau đó, bạn có thể bọc rằng trong các thẻ html. Không chụp được loại tài liệu hoặc bất kỳ thứ gì khác mà bạn có bên ngoài các thẻ html, nhưng đó là một cách nhanh chóng để lấy hầu hết nội dung.

+1

+1. Nếu không có thông tin tiêu đề là cần thiết hơn điều này làm việc cho cơ thể là tốt. Nó hoạt động ngay cả đối với mỗi thẻ duy nhất. –

+0

Điểm tốt, nó chắc chắn là cách nhanh chóng và bẩn thỉu của grabbing một loạt các html từ nơi mà bạn cần nó – wajiw

+1

Xin lỗi tôi quên đề cập đến. Tôi cần lấy nội dung từ một trang khác. Không phải Javascript đang chạy. –

5

Tôi biết câu hỏi này là thực sự cũ bây giờ, nhưng tôi đã có cùng một vấn đề với cố gắng để có được các nội dung trang vào một biến, nhưng cuối cùng đã tìm ra một cách trong Javascript: D (Với một số trợ giúp từ internet ...)

Vì vậy, ở đây nó đi ...

tôi đã thực hiện một chức năng với một callback để có được một trang mong muốn:

function getPageContents(callback,url,params) { 
    http=new XMLHttpRequest(); 
    if(params!=null) { 
     http.open("POST", url, true); 
     http.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    } else { 
     http.open("GET", url, true); 
    } 
    http.onreadystatechange = function() { 
     if(http.readyState == 4 && http.status == 200) { 
      callback(http.responseText); 
     } 
    } 
    http.send(params); 
} 

Lưu ý rằng tôi đã thực hiện nó theo cách như vậy, nó sẽ không chấp nhận GET paramaters. Đây là cố ý, vì tôi không cần sử dụng GET cho đơn đăng ký của mình. Nếu các thông số được đặt, các thông số này sẽ được gửi dưới dạng POST.

Sau đó, để sử dụng chức năng, cho phép nói rằng tôi muốn gửi một tên để findpersoninfo.php đó sẽ ra một mảng JSON của những thông tin cá nhân, tôi có thể làm điều này:

getPageContents(function(result) { 
    personinfo=JSON.parse(result); 
    //Now I can do anything here with the personinfo array 
},'http://localhost/findpersoniinfo.php','fname=stretch&lname=wright') 

Lấy nó một bước xa hơn, bạn có thể làm tổ này trong chức năng khác, cho phép gọi nó là getPersonInfo():

function getPersonInfo(fname,lname) { 
    getPageContents(function(result) { 
     personinfo=JSON.parse(result); 
     //Now I can do anything here with the personinfo array 
    },'http://localhost/findpersoninfo.php','fname='+fname+'&lname='+lname) 
} 

Tất nhiên, kiến ​​thức của tôi về Javascript vẫn còn trong giai đoạn phôi thai của nó, và hoan nghênh bất kỳ thông tin phản hồi mang tính xây dựng: D

1

Một giải pháp đơn giản để tải dữ liệu JSON từ một url như /v1/data?format=json:

xmlhttp=new XMLHttpRequest(); 
xmlhttp.open("GET", "/v1/data?format=json", false); 
xmlhttp.send(); 
var data = JSON.parse(xmlhttp.responseText); 
Các vấn đề liên quan