Execute ajax to load the js summary in the page

Source: Internet
Author: User
Document directory
  • Event background

 

I read the article "javascript contained in the page for executing ajax loading". Recently, I 've been entangled in this issue, and I am dedicated to the children's shoes who are reluctant to get started...

Event background

There is a public page that needs to be called on multiple pages. Some of the js involved has been written in the public page. After loading the page through ajax, JavaScript cannot be executed.

Solution

1. Use the method of attaching an iframe to execute js, so that I am not getting started with code cleaner.

2. Use document. write to output the code. I am not willing BY THE conciser.

3. The simplest method is to place js on the parent page to be called. To create a public page like this, every local call should be written once, and the code is redundant.

4. eval is a solution, though inefficient.

5.
Complex Solution: RegEx matches all the js files on the loaded page, creates the same number of <script> tags for these js files, and inserts the js content for execution. However, it is found that firefox is feasible, but IE is still unavailable.(Teacher, you can start from here ~)

Solution

Based on the above methods, we can eliminate unfavorable factors and summarize a more practical method to meet the js requirements for executing ajax loading on a public page like this, add code to the public functions loaded by ajax. The main code is as follows:

// Step 1: Match whether the loaded page contains js
Var regDetectJs =/<script (. | \ n) *?> (. | \ N | \ r \ n )*? <\/Script>/ig;
Var jsContained = ajaxLoadedData. match (regDetectJs );
// Step 2: if Javascript is included, extract the js from the section and load it for execution.
If (jsContained ){
// Extract js Regular Expressions in Segments
Var regGetJS =/<script (. | \ n) *?> (. | \ N | \ r \ n )*)? <\/Script>/im;
 // Execute js in Segmented Order
Var jsNums = jsContained. length;
For (var I = 0; I <jsNums; I ++ ){
Var jsSection = jsContained [I]. match (regGetJS );
 If (jsSection [2]) {
If(window.exe cScript ){
// Special treatment for IE
Window.exe cScript (jsSection [2]);
} Else {
// Used by most other browsers
Window. eval_r (jsSection [2]);
}
}
}
}

Explanation:Window.exe cScriptFor IE, other browsers need to useEval.

This is a perfect solution.

Function executeScript (html ){
Var reg =
/<Script [^>] *> ([^ \ x00] +) $/I;
// Split the entire HTML segment by <\/script>
Var
HtmlBlock = html. split ("<\/script> ");
For (var I in
HtmlBlock ){
Var
Blocks; // the array of content matching the regular expression. blocks [1] is the actual script content, because we used brackets for the previous reg definition to capture the group.
If
(Blocks = htmlBlock [I]. match (reg ))
{
// Clear comments that may exist. For the end of the comment --> you can ignore the processing, and the eval works normally.
Var
Code = blocks [1]. replace (/<! --/,'');
Try
{
// Eval_r (code)
// Execute the script
If (!! (Window. attachEvent &&
! Window. opera ))
{
// Ie
ExecScript (code );
}
Else {
// Not
Ie
Window. eval_r (code );
}

} Catch (e)
{
}
}
}
}

In addition:

// Run ajax to return the js script
FunctionEvalGlobal (strScript ){

Var a = document. createElement_x ("script ");
A. type =
"Text/javascript ";
A. text = strScript
;
Document. getElementsByTagName_r ("head") [0]. a ()
;
}

Function executeScript (html ){
Var reg =
/<Script [^>] *> ([^ \ x00] +) $/I;
// Split the entire HTML segment by <\/script>
Var
HtmlBlock = html. split ("<\/script> ");
For (var I in htmlBlock)
{
Var
Blocks; // the array of content matching the regular expression. blocks [1] is the actual script content, because we used brackets for the previous reg definition to capture the group.
If
(Blocks = htmlBlock [I]. match (reg ))
{
// Clear comments that may exist. For the end of the comment --> you can ignore the processing, and the eval works normally.
Var
Code = blocks [1]. replace ('/\ <\! \-\-/','');
Code =
Code. replace ('/\-\> /','');
Try
{
EvalGlobal (code );
// Eval_r (code)
// Execute the script

} Catch (e)
{
}
}
}
}

Handle the following in the ajax callback function:

Function loadCallBack (){
If (xmlHttp. readyState = 4 &&
XmlHttp. status = 200 ){
HideLoading ();
Var
Response =
XmlHttp. responseText;
Document. getElementByIdx_x ("Container"). innerHTML
= Response;
ExecuteScript (response );
} Else
{
ShowLoading ();
}

}

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.