Welcome to Software Development on Codidact!

Will you help us build our independent community of developers helping developers? We're small and trying to grow. We welcome questions about all aspects of software development, from design to code to QA and more. Got questions? Got answers? Got code you'd like someone to review? Please join us.

Comments on How this recursive treewalker works?

Post

How this recursive treewalker works?

−4

Credit for User:Meriton for developing the following code (first published here).

function replaceIn(e) {
  if (e.nodeType == Node.TEXT_NODE) {
    e.nodeValue = e.nodeValue.replaceAll("a", "");
  } else {
    for (const child of e.childNodes) {
      replaceIn(child);
    }
  }
}

replaceIn(document.body);

How this recursive treewalker works?

As a side question which I grasp as important, can there be an even simpler and more direct version without the else?

posted almost 2 years ago

CC BY-SA 4.0

2y ago

deleted user

Raw

Markdown

History

is a duplicate

This question has been asked before and has already been answered. It should be marked as a duplicate.

Please enter the URL of the proposed duplicate in the details field below.

not constructive

This question cannot be answered in a way that is helpful to anyone. It's not possible to learn something from possible answers, except for the solution for the specific problem of the asker.

2 comment threads

As explained [here](https://software.codidact.com/posts/286333), there are different types of nodes. ... (8 comments)

What is the goal that you want to achieve? Why do you want to avoid using an if-else? (6 comments)

hkotsubo‭ wrote almost 2 years ago

copy link

As explained here, there are different types of nodes. And this code traverses through all document's nodes, but the replace only makes sense in text nodes (here there's an explanation of why only text nodes should be changed - to not destroy HTML's structure).

So the if is needed to know the node's type, and replace only text nodes. If you don't want to test it in the function, the alternative is to first get a list that contains only text nodes, such as an actual tree walker - AKA the code that I suggested here.

deleted user wrote almost 2 years ago · edited almost 2 years ago

copy link

hkotsubo‭

I guess you meant

const walker = document.createTreeWalker(document.body, NodeFilter.SHOW_TEXT);
let node;
while ((node = walker.nextNode())) {
    node.textContent = node.textContent.replace(/x/g, '*');
}

This also contains syntax which I generally don't bump into in JavaScript, such as

let node;

As can be read It's not let node = x; which is more "regular".

I am looking for a treewalker with more "regular" JavaScript.

Hopefully you understand what I mean.

hkotsubo‭ wrote almost 2 years ago · edited almost 2 years ago

copy link

let node; is "regular JavaScript". It's just declaring a variable without assigning an initial value, which is not uncommon. I didn't assign a value because it wasn't needed, as this will be made in the loop. Of course you could do:

let node = 1;
while ((node = walker.nextNode())) {
   etc...

But why assign a value that would not be used and overwritten right in the next line?

hkotsubo‭ wrote almost 2 years ago

copy link

deleted user

"from my experience with elementary and basic JavaScript tutorials it's not common"

Well, from my experience (I'm not bragging about it, but it goes beyond basic), it's not uncommon. Regarding readability, well, that's very subjective, and setting an initial value is not always necessary.

By the way, have you tried while ((let node = walker.nextNode()))? This code gives a syntax error, one more reason to declare the variable before the loop. And in this case, there's no real gain in doing this:

let node = someValue;
while ((node = walker.nextNode()))
    ...

Why set someValue to the variable, if this value will be overwritten right in the next line? This value won't be used at all for anything, then setting it to the variable is useless and not necessary.

Communities

Comments on How this recursive treewalker works?

How this recursive treewalker works?

2 comment threads