jq html t替换,javascript - innerHTML works jQuery html() doesn't - Stack Overflow

For some reason I can't get jQuery html() function to work. I've tried the following:

Find a specific div:

var div = $("#divId");

Outcome: works

Test that i can use it with jQuery:

alert($(div).attr("id"));

Outcome: works; the id is presented

Get the html within the div:

alert($(div).html());

Outcome: does not work; empty alert

Get the html within the div with innerHTML:

alert(document.getElementById($(div).attr("id")).innerHTML);

Outcome: works; the div content is presented in the alert

The actual code:

$(document).ready(function(){

var autocomp = namespace('mx.autocomp');

autocomp.overlay = (function() {

var formId;

var $searchValueComp;

var $searchResultComp;

function init(inFormId, inSearchValue){

formId = inFormId;

$searchValueComp = $("#"+inFormId).find("[id$="+inSearchValue+"]");

$searchResultComp = $("#"+inFormId).find("[id$=searchResult]");

}

function handleOverlay(){

var fn = window[formId + "OverlayWid"];

var result = document.getElementById($searchResultComp.attr("id")).innerHTML;

if($searchValueComp.val().length==0){

fn.hide();

}

// Test - This does not work as I get an empty alert

alert($searchResultComp.html());

// Edit1: New test, this works.

// When I use this javascript, I start with initializing the script from the page

// using the "init(inFormId, inSearchValue)" function. The handleOverlay() function

// is called through the "oncomplete='mx.autocomp.overlay.handleOverlay();'" of a

// p:remoteCommand that executes a search in the db and then update the div called

// "searchResultComp".

//

// Only reason I can think of why the code below works is that the jQuery object $test

// is created after the div called "searchValueComp" has been updated by p:remoteCommand.

// However, I don't understand why the jquery object "searchValueComp" wouldn't have

// access to the same content as it should look for it first when the html() function

// is called. Or is the content of the div searchValueComp set immediately when the

// object is created in the "init" function?

var $test = $("#"+formId).find("[id$=searchResult]");

alert($test.html());

// I need to check if the div: "searchResultComp" has any content.

// As I don't get $searchResultComp.html() to work, I'm forced to

// use the "getElementById" way instead.

if(result.length==0){

fn.hide();

}else{

fn.show();

}

}

function print(text){

$("#textCheck").prepend(text + '\n');

}

return {

handleOverlay: handleOverlay,

init: init

};

})();

});

What am I doing wrong?