How to add text to any html element?

问题:

I want to add text to body element but I don't know how. Which method will work on the body tag? Sorry for my english and thanks for replies.

回答1:

In Watir, you can manipulate a web page (DOM) using JS, just like that:

 browser.execute_script("document.getElementById('pageContent').appendChild(document.createTextNode('Great Success!'));")

I assume that the point of the question is: All users are not just interacting by just clicking buttons and links on the web app, some of them are doing nasty things like altering http requests to make your system do something that it is not supposed to do... or to just have some fun.

To mimic this behavior, you could write a ui-test that alters forms on the web page, so that for example, one could type in anything into any field instead of a limited dropdown.

To do that, ui test has to:

• manipulate DOM to set form inputs free of limitations (replace select's with input's, etc.)
• ui test has to know, which values to use, in many cases it's pointless to enter random values. Your webapp has to provide some good "unwanted" options.

回答2:

Why would you want to modify the webpage in Watir? It's for automated testing, not DOM manipulation.

If you want to add something to the DOM element in javascript, you can do it like that:

var txt = document.createTextNode(" This text was added to the DIV.");
document.getElementById('myDiv').appendChild(txt); 

Or use some DOM manipulation library, like jQuery.

回答3:

If you have not worked your way though the watir tutorial, I would suggest you do so. It deals with things like filling in text fields etc.

Learn to use the developer tools for your browser, Firebug for Firefox, or the built in tools for IE and CHrome. They will let you look at things as you interact with the site.

If the element is not a normal HTML input field of some sort, then you are dealing with a custom control. Many exist and they are varied and there is no one set solution for dealing with them. Without knowing which control you are using, and being able ourselves to interact with a sample of it, or at least see the HTML, it is very very difficult to advise you, we basically have to just guess (which is often a waste of everyone's time)

Odds are if you have a place you can enter text, then it is some form of input control, it might not start out that way, you may need to click on some other element, to make the input area appear, but without a sample of HTML all we can do is guess.

If this is a commercial control, see if you can find a demo site that shows the control in action. Try googling things like class names for the elements and often you get lucky