-1

在我的扩展中,我使用 .复制网页的 HTML 内容$.html()。但是,这样做会丢失一些值,例如<select>元素。为了解决这个问题,我给网页的每个元素一个唯一的 id,然后获取 HTML 内容,在那个 HTML 内容中,我尝试正确设置值。然而,这并没有奏效。这是代码片段:

$( function() 
{ 
    $('*').each( function(i) 
    { 
        $(this).attr('uid', i);
    }); 
});

var html_data = $("html").html();
$("option:selected", html_data).removeAttr("selected");
var all_selected = $("option:selected");
for (var i = 0; i < all_selected.length; i++) 
{
    var uid = $(all_selected[i]).attr("uid");
    $("[uid="+uid+"]", html_data).attr("selected", true)
} 

问题是,当我执行“ $("option:selected", html_data).removeAttr("selected");”时,它确实返回删除了“选定”的元素,但原始 html_data 保持不变。似乎 html_data 是只读的。我还尝试将这些标签替换为来自.removeAttr("selected"). 但是,这也不起作用。

有解决办法吗?

更新:从第一个答案来看,似乎有些混乱。让我试着澄清一下:

  • 我无法直接在网页上更改“选定”值。
  • 我想获取整个网页并将其发送到我的后端控制页面(background.js)。
  • 但是,当我使用 .html() 将整个网页发送到后端时,选定的值会丢失。
4

1 回答 1

0

这是我解决这个问题的方法。

内容脚本端代码:

//First, generate a unique id for each element                                                                  
$(function() { $('*').each(function(i) { $(this).attr('my_uid', i);}); });

//Once you send the page to the backend, all information such as whether the 
//element is rendered or not is lost. To retain that, add one more attribute to 
//each element                                                          
$(function() {
       $('*').each(function(i) {
         if ($(this).is(":visible")) {
              $(this).attr('final_rendering', "visible");
         }
         else {
              $(this).attr('final_rendering', "hidden");
         }
  });
});

//Collect all values that are lost in an object                  
var my_vals = {};
var input_elements = $(":input[type='text'], select");

for (var i = 0; i < input_elements.length; i++) {
     var uid = $(input_elements[i]).attr("my_uid");
     var val = $('[my_uid='+ uid +']').val();
     my_vals[uid] = val;
}

var html_page = $("html").html();
send_response({
    'html_page' : html_page,
    'my_vals'  :  my_vals
});

后台脚本代码:

function get_html_page_cb(ret_val) {

   var html_page = ret_val['html_page'];
   var my_vals = ret_val['my_vals'];
   var html_doc_copy = document.implementation.createHTMLDocument("webpage");
   html_doc_copy.documentElement.innerHTML = html_page;

   for (var id in my_vals) {
      $("[my_uid="+id+"]",html_doc_copy).val(my_vals[id]);
   }
}

如果有人有更好的主意,我会全力以赴。

于 2013-07-23T18:32:20.487 回答