replace span class with other span class - google-chrome

It's kind of hard to explain. basically I want to change the span text in a class to the span text of another text in a chrome extension. The website code looks like this:
enter image description here
I want to change that 6 to the text of the other class that the 8 is in. I don't really know java that well so can someone please help.
EDIT:
I figured out how to change only that class but i still don't know how to get the text of the other class and change it to that. I was trying this:
document.getElementsByClassName('points').innerHTML
but it returned undefined.

The getElementsByClassName() function doesn't return just one item:
Returns an array-like object of all child elements which have all of the given class names.
Source: Document.getElementsByClassName()
I'm not too sure what your requirement is as the question is rather ambiguous. My assumption is that you would like the score and points to match for each score-wrapper section, like so:
var scoreWrappers = document.getElementsByClassName('score-wrapper');
[].forEach.call(scoreWrappers, function (scoreWrapper) {
var score = scoreWrapper.getElementsByClassName('score')[0];
var points = scoreWrapper.getElementsByClassName('points')[0];
score.innerText = points.innerText;
});

Related

How to Retrieve Values from a Class Within a Class Using JavaScript

I am not experienced with HTML and 'JavaScript', and is having a roadblock when attempting to check the values from a class.
Below is the source as seen from F12
I would like to retrieve all createdby text -muted values (as they may contain more than one row) to check if any of them matches SYSTEM, may I know how can it be done?
I understand that an image is not the best way to portrait my question, I will try to type the source in my question.
My apologies, and thank you.
You can get NodeList which contains createdby text-muted classes using document.querySelectorAll as follows.
const elems = document.querySelectorAll(".createdby .text-muted");
elems.forEach((item) => {
console.log(item.innerHTML); // This will contain the text value of the selected selector
});

AS3: Change TextField Text on multiple instances of the same MovieClip

I have a MovieClip called "number" in the library. I need to add multiple instances of that MovieClip to stage. Instances should be called number1, number2,number3...and each one needs to have different text inside it.
Is it possible to do this without code, just using flash interface tools? If not, could someone help me with coding that?
Thanks!
For an Class linked MyNumber containing a text field named output:
const N:int = 3; // 3 instances
const TEXTS:Array = ['text 1', 'text 2', 'text 3']; // 3 texts
var n:MyNumber;
for (var i:int = 0; i < N; i++) {
n = new MyNumber();
n.y = 50 * i;
n.output.text = TEXTS[i];
this.addChild(n);
}
You have to use code - at least a little bit.
In addition to #helloflash's answer, here is a simpler solution (with some caveats described below).
On your movieClip, make your text box dynamic, and give it an instance name of txt (or whatever you'd like). Then, put the following line of code on the first frame of your movieClips's timeline:
txt.text = this.name; //works if your text is a simple word with no spaces/puntuaction/symbols and doesn't match any actionscript keywords
This will set the text to whatever the instance name of each movieClip is. Will work great if you text is something simple like "Hello" or "Player1".
Now, if you're text is a number (or starts with one), or your text matches a keyword or already defined variable (like this/continue/function/break/stop/play etc), you'll need make it a bit more complicated, something like this:
txt.text = this.name.replace("$MC_","");
Then give your instance name in this format: $MC_stop, the code will strip out the $MC_ part and show the rest. so the text field would be "stop".
Now, if you want to include spaces, or most symbols (dollar sign, underscore and dash I think are the only supported ones), you'll have to add a replace for each one and create a place holder for that character.
So if your text was "This is my text", you should give it an instance name of `this_is_my_text" and this should be the code:
txt.text = this.name.replace("_"," "); //replace all underscores with space
Add as many replace statements for as many characters you need.
So, if you text was "1. This is my text!!!" - The instance name could be: $MC_1$dot_This_is_my_text$ex$ex$ex and the code:
txt.text = this.name.replace("$MC_","").replace("_"," ").replace("$dot",".").replace("$ex","!"); //you can keep chaining on as many replace statements as you need.
Of course, at this point you might as well just use full on code like #helloflash's answer. But if you text isn't that complicated, this may be a good solution for you.

How to copy Input Text Value into Dynamic Text that is in a MovieClip1 Inside a MovieClip2

Current my code is as such
setcustomlocation.addEventListener(MouseEvent.CLICK,customlocation2);
function customlocation2(e:MouseEvent):void
{
locationinput.text = FlashingWon.Won1.name.text;
}
I'm trying to make it such that it would copy the input text field values into a dynamic text. However, it throws up the error that
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at main/customlocation2()[main::frame1:9]
Which can I only assume that it is not able to communicate with the dynamic text field in the movieclip within another movieclip.
First, you can be 100% sure that it CAN communicate with the dynamic TextField in the MovieClip.
From you description I understand that you wish to copy from input into dynamic. But from your code I see that you take from the dynamic into the input, please check that out:
// This will copy in such a way: input <= wonText
locationinput.text = FlashingWon.Won1.name.text;
// This will copy from input
FlashingWon.Won1.name.text = locationinput.text;
Anyhow, the error that you get has nothing to do with this, it's rather like you already noticed, that one of your TextField is not 'found'. For this I recommend you a best practice: To create instances of the objects you want to use and populate them from the stage through the getChildByName method. This way you will promptly now (specially if you do this on construction or init) if you had any misspelling or miss structure on the childs you want to get.
like so:
var inputText: TextField;
var dynoText: TextField;
In your Constructor or else where at a soon level, give to your vars the proper value:
inputText = getChildByName('locationinput') as TextField;
dynoText = FlashingWon.Won1.getChildByName('name') as TextField;
This way you will soon enough know if one of this 2 textFields were not found under the object you give, and you have only one place to miss spell it. Also you will get code completion on your TextFields.
Finally the copy text part:
dynoText.text = inputText.text;
Hope it helps.
Alright, sorry for the delay, I was out on holidays.
I have opened your example and can see where the problems are:
1) You are trying to reach the FlashingWon when initiating the dynoText on the FIRST frame like so var dynoText = FlashingWon.Won1.getChildByName('name_txt'); BUT the FlashingWon element is ONLY available on the FIFTH frame. Meaning that you cannot refer to it quite yet, unless you add it on the first frame and make in invisible till the fifth frame. (You can make it visible in the goto1 function if you wish after the goToAndStop(5) line)
2) You called the TextField on the Won1 element 'name' which is a restricted sting in AS3, so change it to name_txt or label if you wish and it will work.
Let me know how it worked.

Actionscript 3 - get position of Cursor in TextArea?

I am making something in Actionscript 3, where people can modify a piece of text, within a TextArea.
Now, it's easy to get the typed character, but using event.getChar.
But, I would also like to know where the character was typed: the (text)cursor position.
I've read about that it's easy to do with a TextField, however, I want to use a TextArea for a few reasons:
I've read about it being possible with a TextField, but I'm not sure how I would make that into an input field...
Also, the TextArea is recommended for multiline text.
If I could hack a TextField to behave like a TextArea, I'm fine with that.
So, my question:
How can I get the position of the cursor in a TextArea?
or
How can I make a TextField behave like a TextArea?
EDIT: I managed to make an input TextField, but the caretIndex returns xyz coordinates, pretty useless for text editing/comparing... Any suggestions on that?
you can see which letter was clicked in a textfield by doing the following:
var tf:TextField;
var clicked_on_index:int = tf.getCharIndexAtPoint(tf.mouseX, tf.mouseY);//find index of char clicked on in string
var clicked_on_char:String = tf.text.substr( clicked_on_index, 1 );//find char clicked on from textfield
or if you just want to know the position of the last character entered:
var tf:TextField;
tf.addEventListener(Event.CHANGE,function(event:Event):void{
var newCharacterPosition:int=tf.caretIndex;
var totalCharacters:int=tf.text.length;
});

Get page selection including HTML?

I'm writing a Chrome Extension, and I was wondering if it was possible to get the selected text of a particular tab, including the underlying HTML? So if I select a link, it should also return the <a> tag.
I tried looking at the context menu event objects (yes, I'm using a context menu for this), and this is all that comes with the callback:
editable : false
menuItemId : 1
pageUrl : <the URL>
selectionText : <the selected text in plaintext formatting, not HTML>
It also returns a Tab object, but nothing in there was very useful, either.
So I'm kind of at a loss here. Is this even possible? If so, any ideas you might have would be great. Thanks! :)
Getting the selected text of a page is fairly easy, you can do something like
var text = window.getSelection().toString();
and you'll get a text representation of the currently selected text that you can pass from a content script to a background page or a popup.
Getting HTML content is a lot more difficult, mostly because the selection isn't always at a clean HTML boundary in the document (what if you only select a small part of a long link, or a few cells of a table for example). The most direct way to get all of the html associated with a selection is to reference commonAncestorContainer, which is a property on a selection range that corresponds with the deepest node which contains both the start and end of the selection. To get this, you'd do something like:
var selection = window.getSelection();
// Only works with a single range - add extra logic to
// iterate over more ranges if needed
var range = selection.getRangeAt(0);
var container = range.commonAncestorContainer;
var html = container.innerHTML
Of course, this will likely contain a lot of HTML that wasn't actually selected. It's possible that you could iterate through the children of the common ancestor and prune out anything that wasn't in the selection, but that's going to be a bit more involved and may not be necessary depending on what you're trying to do.
To show how to wrap this all up into an extension, I've written a short sample which you can reference:
http://github.com/kurrik/chrome-extensions/tree/master/contentscript-selection/
If you don't want all of the siblings, just the selected HTML, use range's other methods like .cloneContents() (to copy) or .extractContents() (to cut).
Here I use .cloneContents():
function getSelectedHTML() {
var range = window.getSelection().getRangeAt(0); // Get the selected range
var div = document.createElement("div");
div.appendChild(range.cloneContents()); // Get the document fragment from selected range
return div.innerHTML; // Return the actual HTML
}