多次替换outerHTML - Android Webview

时间:2013-09-14 08:18:32

标签: javascript android html webview xhtml

我正在尝试使用XHTML元素对outerHTML页面进行一些修改,通过Javascript函数访问。执行此操作的Javascript函数从Android WebView调用,如下所示:
1.按下一个按钮,调用Javascript函数访问outerHTML元素,存储,并且只是为了它,将其分配给另一个变量并替换它:document.getElementById("bodyTag").outerHTML = newHTML < / p>

第一次按下按钮时,所有这一切都正常。第二次按下会导致以下LogCat错误:

09-14 13:24:21.432: V/com.sriram.outerhtml.OuterHTML$2@4052e0f8(10931): Clicked click!
09-14 13:24:21.432: V/com.sriram.outerhtml.OuterHTML@40520da8(10931): Replacing outerHTML
09-14 13:24:21.452: D/com.sriram.outerhtml.OuterHTML$1@4052dcf8(10931): jswebview: Function to replace outerHTML.. with itself of level = LOG at line: 410
09-14 13:24:21.452: D/com.sriram.outerhtml.OuterHTML$1@4052dcf8(10931): jswebview: Uncaught TypeError: Cannot read property 'outerHTML' of null of level = ERROR at line: 411  

我的问题:
1.错误表示文档中没有带有该标记的元素。但事实并非如此,因为它第一次有效。错误在哪里?
2.我如何做到这一点?

代码:
OuterHTML.java

/*
 * Each time the button is clicked, a javascript function is invoked.
 * Javascript function: Takes outerHTML, assigns it to new variable and replaces it.
 */

package com.sriram.outerhtml;

import java.io.File;

import android.app.Activity;
import android.os.Bundle;
import android.os.Environment;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.webkit.ConsoleMessage;
import android.webkit.WebChromeClient;
import android.webkit.WebView;
import android.widget.Button;

public class OuterHTML extends Activity {

    private WebView wv;
    private Button click;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_outer_html);

        wv = (WebView) findViewById(R.id.webview);
        wv.getSettings().setJavaScriptEnabled(true);

        String path = Environment.getExternalStorageDirectory().getAbsolutePath() + "/JsWebView/";
        String path_file = "file:///" + path + "mypage_copy.xhtml";

        wv.loadUrl(path_file);

         wv.setWebChromeClient(new WebChromeClient() {

            @Override
            public boolean onConsoleMessage(ConsoleMessage cm) {
                /* 
                 * 1.Override console message to display messages from the javascript function.
                 */
                if(cm.messageLevel().equals("ERROR")) {
                    Log.d(this.toString(), "jswebview: " + cm.message() + " of level = " + cm.messageLevel() + " at line: " + cm.lineNumber());
                } else {
                    Log.d(this.toString(), "jswebview: " + cm.message() + " of level = " + cm.messageLevel() + " at line: " + cm.lineNumber());
                }
                return true;
            }
         });

        click = (Button) findViewById(R.id.click);
        click.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Log.v(this.toString(), "Clicked click!");
                replaceOuterHTML();
            }
        });
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.outer_html, menu);
        return true;
    }

    public void replaceOuterHTML() {
        Log.v(this.toString(), "Replacing outerHTML");
        wv.loadUrl("javascript:replaceOuterHTML()");
    }
}

布局:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".OuterHTML" >

    <Button
        android:id="@+id/click"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:text="Click" />

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/click"
        android:text="@string/hello_world" />

</RelativeLayout>

XHTML页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta content="application/xml+xhtml;charset=UTF-8" />
<script src="highlightWordInSentence.js" type="text/javascript"></script>
<script src="jquery-2.0.2.min.js"> </script>
<title>Building your resume</title>
</head>
<body xmlns="http://www.w3.org/1999/xhtml" id="highlightbegin">
<h1>Building your resume</h1>
</body>  
</html>  

Javascript函数:

function replaceOuterHTML() {

    console.info("Function to replace outerHTML.. with itself");
    var oldHTML = document.getElementById("highlightbegin").outerHTML;
    if(!oldHTML) {
        console.error("oldHTML is null.");
    } else {
        console.info("replacing oldHTML");
        var newHTML = oldHTML;
        document.getElementById("highlightbegin").outerHTML = newHTML;
    }
}

0 个答案:

没有答案