如何通過JS獲取網站的實際HTML代碼？

-2

我有一個表單的網站。例如，我向用戶展示的數據填充表格：如何通過JS獲取網站的實際HTML代碼？

<input type='text' value="" name="dsa" />

而且他用「3」的值填充它;

然後他點擊按鈕「保存」。現在我想擁有包含字段值的網站的整個HTML。所以我用：

document.documentElement.innerHTML

，但我得到：

<input type='text' value="" name="dsa" />

但我要得到這樣的：

<input type='text' value="3" name="dsa" />

注意我要採取全HTML的網站，不僅一個領域。我不知道網站上會有什麼字段，所以我需要一個通用的解決方案。

來源

2012-07-24 Tomasz Smykowski

你能解釋一下你正在努力完成什麼嗎？ – asawyer 2012-07-24 13:48:24

[讀取帶有VALUE屬性（及其值）的INPUT標記的HTML表單的innerHTML]的可能的重複]（http://stackoverflow.com/questions/7601851/reading-innerhtml-of-html-form-with-value-attribute -its-value-of-input-tags） – epascarello 2012-07-24 13:49:33

@asawyer呃..我不知道你想讓我解釋一下。請解釋一下在這個問題中不可理解的東西。 – 2012-07-24 13:52:44

AFAIK您無法從HTML代碼中獲取此代碼，因爲當用戶在輸入文本字段中輸入內容時HTML代碼不會更改。

你可以做的是讓頁面上的所有輸入字段和像這樣的東西讓他們的價值觀：

var inputs, index; 

inputs = document.getElementsByTagName('input'); 
for (index = 0; index < inputs.length; ++index) { 
    // deal with inputs[index] element. 
}

的代碼是從這個帖子：https://stackoverflow.com/a/2214077/312312 我是懶得寫下來我自：P

來源

2012-07-24 13:48:11 Lefteris

我不想獲取字段的值。正如我寫的，我想抓住整個HTML與這個值的地方。有任何想法嗎？ – 2012-07-24 13:51:48

你爲什麼要這麼做？你不能，如果你填寫字段，HTML不會改變。 – Onheiron 2012-07-24 13:53:05

如果頁面只有輸入文本字段，請按照原樣（不包含輸入的值）抓取HTML，使用我提供的代碼抓取值，並在抓取的HTML代碼中將value =「」替換爲value =「X」，其中X是你從上面的代碼得到的值 – Lefteris 2012-07-24 13:53:17

在jQuery中我做

$(function() { 
    $('input').keyup(function() { 
     $(this).attr('value', $(this).val()); 
    }); 

});

因爲值屬性沒有鑰匙後成立

來源

2012-07-24 13:52:53

我正要發佈這個。這裏是一個jsfiddle：http://jsfiddle.net/cpbX6/我用.change（）代替.keyup（） – 2012-07-24 13:54:09

我不使用jQuery庫。 – 2012-07-24 13:54:23

@tomaszs開始這樣做。有人注意到你想用javascript處理jQuery不能做的事情。 – 2012-07-24 13:58:29

-1

您可以嘗試在整個文檔上設置一個實時事件，該事件將設置屬性爲HTML，並且用戶設置值或在提交時設置它們。

例如

$("body").on("change", "select,input,textarea", function(){ 
    $(this).attr("value", $(this).val()); 
});

第一種方式，但本不應該如此盲目做，你會得到與復位問題。你應該解決與選定的電臺，複選框和其他屬性的問題，不僅值。

第二種方法是在真正需要時序列化整個頁面。

var serialize = function(el){ 
    $("select, input, textarea").each(function(){ 
    $(this).attr("value", $(this).val()); //the same way as upper 
    }); 
} 
$(".serialize").click(function(){ 
    var inner = $("body"), 
     html; 
    serialize(inner); 
    html = inner.html(); //here you will get whole html with setted attributes 
});

這種方式似乎更好，因爲那裏不會是不必要的事件的委派。

http://jsfiddle.net/CeAXL/2/ - 測試示例。

但是在兩種方式中，將永久值設置爲DOM本身並不是一個好主意。

來源

2012-07-24 14:07:27 Flops

不錯，但我需要一個JavaScript解決方案。不使用JQUERY庫。 – 2012-07-24 14:15:14

如何通過JS獲取網站的實際HTML代碼？

回答

相關問題