add and remove html elements to jquery variable [closed] - javascript

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
i have a JS variable like this:
var elmnts = $('#elm1, elm2, #elm3, #elm4')
how can i add and remove other html elements?
i try this code but there is no result.
elmnts.add('#elm5');
elmnts.remove('#elm1')

$.fn.add returns new collection, it doesn't modify original one. So you should use this syntax.
elmnts = elmnts.add('#elm5');
To remove element from a collection of jQuery objects you can use $.fn.not method:
elmnts = elmnts.not('#elm1');
You should not use remove for this, it's used to delete element from DOM tree.

Related

Why does .innerHTML edit the src attributes? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I'm making a chrome extension and trying to replace a certain word with another.
let allElements = document.querySelectorAll('*');
allElements.forEach(function (element) {
element.innerHTML = element.innerHTML.split(word).join("████");
}
The above code edits src and srcset attributes as well.
element.innerText and element.Textcontent removes all the CSS from the webpage.
Unfortunaly inner/outerHTML are changing all child elements too what causes them to be re-rendered by the browser (even if not changed). this also means you may "replace" some text multiple times if your selector received elements from all levels and the replacement text contains the original text too.
So the proper way is to change just the text-elements without touching the child-elements. This way you will not experience any of the mentioned problems:
let word = "yourword"
let allElements = document.querySelectorAll('*');
allElements.forEach(function (element) {
element.childNodes.forEach(function(el){
if (!el.nodeValue) return;
el.nodeValue = el.nodeValue.split(word).join("████");
});
});

how to pass a variable to queryselectorAll? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
Hi I want to pass a variable to queryselectorAll. I tried a couple of things but non have worked for me. I'm doing that because in my code I change the variable to a new one every time a click a button.
var container = document.getElementById(containerBox.id)
// I want containerBox.id to be called in querySelectorAll
templateDiv = document.querySelectorAll('#' + 'containerBox.id' + 'template')[0].content.firstElementChild
Thanks in advance
This question can be simplified to: How do I construct a string from fixed parts and a variable part?
The answer to that is:
'#' + containerBox.id + 'template'
(i.e. just don't put quotes around your variable name).
But why bother using .querySelectorAll() just to grab the first index? You could simply call .querySelector() instead.
And if all you need to get is an element with a specified id, you can just do this:
document.getElementById(containerBox.id + 'template')
... which is the method you're already using in your first line.

Using innerHTML for partial HTML [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
the following function
<script>
function new_par()
{
var beginning="<input id=";
document.getElementById("debug").innerHTML=beginning;
}
</script>
produces no output, although if I remove the "<" sign, it does. Presumably the javascript avoids an output that would destroy the html page, but would there be anyway to force the output?
You're assigning it to a node's innerHTML property. When you plug the string into the DOM it's trying to parse it as though it were HTML. If you were to simply add it as a text node it would appear.
var beginning="<input id=''";
document.body.textContent = beginning;
https://jsfiddle.net/2patzyo1/
Edit: upon looking again at your question, if you are trying to get the input element to appear on the page, the string you're using isn't proper HTML because you never closed the tag. When the browser runs into it, it tries to parse and render it, but because it isn't valid it gives up. This will work:
var beginning="<input id=''>";
document.body.innerHTML = beginning;
https://jsfiddle.net/2patzyo1/1/

child.parentNode.removeChild(child) keeps giving a TypeError: Cannot read property 'removeChild' of undefined [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
I'm new to JS and for an assignment I have to remove a div from a facebook post. I'm using
var el = document.getElementsByClassName("someclass");
to find the div, since FB doesn't use ID tags. I can get a value if i run the var but its not working with removeChild for some reason.
getElementsByClassName returns list of elements.
Let us say you have a class with name "class1" attached to multiple elements inside the document, it will return all the elements with class name "class1".
You can iterate though result of getElementsByClassName like normal array.
For example:
if you want to remove first element that matches with this class name. then
el[0].parentNode.removeChild(el[0]).
But i would suggest having better logic to remove this element.

Split a javascript string between two HTML tags [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I have a javascript string which contains a HTML code to be loaded into my app. The issue I am finding is that the string has a bunch of tags in the head tags which just displays as text at the top of the content. How can I remove all the content of the string bar whats between the two body tags?
E.g.
<html><head><meta>...</meta><style>...</style></head><body><div>...</div></body></html>
Needs changing to:
<div>...</div>
Thanks
You can use code below but you better change the service that returns html result.
var s = "<HTML><head><meta><head><body>YOUR HTML</body></html>"
var body = "<body>";
var bodyEnd = "</body>";
var res = s.substring(s.indexOf(body)+body.length,s.indexOf(bodyEnd));

Categories

Resources