AngularJS 1.7.5 - Object doesn't support property or method 'append' in IE9
![Multi tool use Multi tool use](http://sgv.ssvwv.com/sg/ssvwvcomimagb.png)
Multi tool use
I am running an AngularJS 1.7.5 app with webkit-polyfill-injector plugin. The issue happens on IE9 and some versions if Edge.
The IE console throws the issue on this function
function addScriptTag(identifier, json) {
//prep json
var pj = JSON.stringify(json);
//get existing
var tag = element[0].querySelector('script[identifier="' + identifier + '"]');
//update existing
if (tag) {
tag.innerText = pj;
return;
}
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
newTag.append(pj);
//add it
var logoScriptTag = element[0].querySelector('script[type="application/ld+json"]');
logoScriptTag.insertAdjacentElement('afterend', newTag);
}
Here is a webkit-polyfill-injector plugin configuration
var res = {
mode: 'development',
context: path.resolve(__dirname, ''),
entry:
{
app: `webpack-polyfill-injector?${JSON.stringify({
modules: ['./app/app.js']
})}!`
},
output: {
path: outputPath,
publicPath: '/web/',
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js'
},
devServer: {
contentBase: 'build',
host:'192.168.1.101',
port: devServerPort,
historyApiFallback: {
index: '/web/',
rewrites: [
{ from: //soccer/, to: '/soccer.html' }
]
},
watchContentBase: true
},
plugins: [
new PolyfillInjectorPlugin({
polyfills: [
'Promise',
'Array.prototype.find',
]
}),...
Any help would be highly appreciated!
angularjs internet-explorer webkit
add a comment |
I am running an AngularJS 1.7.5 app with webkit-polyfill-injector plugin. The issue happens on IE9 and some versions if Edge.
The IE console throws the issue on this function
function addScriptTag(identifier, json) {
//prep json
var pj = JSON.stringify(json);
//get existing
var tag = element[0].querySelector('script[identifier="' + identifier + '"]');
//update existing
if (tag) {
tag.innerText = pj;
return;
}
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
newTag.append(pj);
//add it
var logoScriptTag = element[0].querySelector('script[type="application/ld+json"]');
logoScriptTag.insertAdjacentElement('afterend', newTag);
}
Here is a webkit-polyfill-injector plugin configuration
var res = {
mode: 'development',
context: path.resolve(__dirname, ''),
entry:
{
app: `webpack-polyfill-injector?${JSON.stringify({
modules: ['./app/app.js']
})}!`
},
output: {
path: outputPath,
publicPath: '/web/',
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js'
},
devServer: {
contentBase: 'build',
host:'192.168.1.101',
port: devServerPort,
historyApiFallback: {
index: '/web/',
rewrites: [
{ from: //soccer/, to: '/soccer.html' }
]
},
watchContentBase: true
},
plugins: [
new PolyfillInjectorPlugin({
polyfills: [
'Promise',
'Array.prototype.find',
]
}),...
Any help would be highly appreciated!
angularjs internet-explorer webkit
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09
add a comment |
I am running an AngularJS 1.7.5 app with webkit-polyfill-injector plugin. The issue happens on IE9 and some versions if Edge.
The IE console throws the issue on this function
function addScriptTag(identifier, json) {
//prep json
var pj = JSON.stringify(json);
//get existing
var tag = element[0].querySelector('script[identifier="' + identifier + '"]');
//update existing
if (tag) {
tag.innerText = pj;
return;
}
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
newTag.append(pj);
//add it
var logoScriptTag = element[0].querySelector('script[type="application/ld+json"]');
logoScriptTag.insertAdjacentElement('afterend', newTag);
}
Here is a webkit-polyfill-injector plugin configuration
var res = {
mode: 'development',
context: path.resolve(__dirname, ''),
entry:
{
app: `webpack-polyfill-injector?${JSON.stringify({
modules: ['./app/app.js']
})}!`
},
output: {
path: outputPath,
publicPath: '/web/',
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js'
},
devServer: {
contentBase: 'build',
host:'192.168.1.101',
port: devServerPort,
historyApiFallback: {
index: '/web/',
rewrites: [
{ from: //soccer/, to: '/soccer.html' }
]
},
watchContentBase: true
},
plugins: [
new PolyfillInjectorPlugin({
polyfills: [
'Promise',
'Array.prototype.find',
]
}),...
Any help would be highly appreciated!
angularjs internet-explorer webkit
I am running an AngularJS 1.7.5 app with webkit-polyfill-injector plugin. The issue happens on IE9 and some versions if Edge.
The IE console throws the issue on this function
function addScriptTag(identifier, json) {
//prep json
var pj = JSON.stringify(json);
//get existing
var tag = element[0].querySelector('script[identifier="' + identifier + '"]');
//update existing
if (tag) {
tag.innerText = pj;
return;
}
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
newTag.append(pj);
//add it
var logoScriptTag = element[0].querySelector('script[type="application/ld+json"]');
logoScriptTag.insertAdjacentElement('afterend', newTag);
}
Here is a webkit-polyfill-injector plugin configuration
var res = {
mode: 'development',
context: path.resolve(__dirname, ''),
entry:
{
app: `webpack-polyfill-injector?${JSON.stringify({
modules: ['./app/app.js']
})}!`
},
output: {
path: outputPath,
publicPath: '/web/',
filename: '[name].bundle.js',
chunkFilename: '[name].bundle.js'
},
devServer: {
contentBase: 'build',
host:'192.168.1.101',
port: devServerPort,
historyApiFallback: {
index: '/web/',
rewrites: [
{ from: //soccer/, to: '/soccer.html' }
]
},
watchContentBase: true
},
plugins: [
new PolyfillInjectorPlugin({
polyfills: [
'Promise',
'Array.prototype.find',
]
}),...
Any help would be highly appreciated!
angularjs internet-explorer webkit
angularjs internet-explorer webkit
edited Jan 1 at 1:59
![](https://i.stack.imgur.com/YnjcO.jpg?s=32&g=1)
![](https://i.stack.imgur.com/YnjcO.jpg?s=32&g=1)
georgeawg
33.3k105068
33.3k105068
asked Dec 31 '18 at 18:42
user2186701user2186701
1315
1315
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09
add a comment |
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09
add a comment |
1 Answer
1
active
oldest
votes
You can try using AngularJS jqLite append:
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
̶n̶e̶w̶T̶a̶g̶.̶a̶p̶p̶e̶n̶d̶(̶p̶j̶)̶;̶
angular.element(newTag).append(pj);
Hopefully it doesn't clash with your polyfill.
For more information, see AngularJS angular.element API Reference - jqLite
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53990495%2fangularjs-1-7-5-object-doesnt-support-property-or-method-append-in-ie9%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
You can try using AngularJS jqLite append:
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
̶n̶e̶w̶T̶a̶g̶.̶a̶p̶p̶e̶n̶d̶(̶p̶j̶)̶;̶
angular.element(newTag).append(pj);
Hopefully it doesn't clash with your polyfill.
For more information, see AngularJS angular.element API Reference - jqLite
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
add a comment |
You can try using AngularJS jqLite append:
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
̶n̶e̶w̶T̶a̶g̶.̶a̶p̶p̶e̶n̶d̶(̶p̶j̶)̶;̶
angular.element(newTag).append(pj);
Hopefully it doesn't clash with your polyfill.
For more information, see AngularJS angular.element API Reference - jqLite
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
add a comment |
You can try using AngularJS jqLite append:
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
̶n̶e̶w̶T̶a̶g̶.̶a̶p̶p̶e̶n̶d̶(̶p̶j̶)̶;̶
angular.element(newTag).append(pj);
Hopefully it doesn't clash with your polyfill.
For more information, see AngularJS angular.element API Reference - jqLite
You can try using AngularJS jqLite append:
//create new
var newTag = document.createElement('script');
newTag.setAttribute("type", "application/ld+json");
newTag.setAttribute("identifier", identifier);
̶n̶e̶w̶T̶a̶g̶.̶a̶p̶p̶e̶n̶d̶(̶p̶j̶)̶;̶
angular.element(newTag).append(pj);
Hopefully it doesn't clash with your polyfill.
For more information, see AngularJS angular.element API Reference - jqLite
answered Jan 1 at 2:06
![](https://i.stack.imgur.com/YnjcO.jpg?s=32&g=1)
![](https://i.stack.imgur.com/YnjcO.jpg?s=32&g=1)
georgeawggeorgeawg
33.3k105068
33.3k105068
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
add a comment |
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
Thanks a lot. It worked.
– user2186701
Jan 2 at 8:00
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53990495%2fangularjs-1-7-5-object-doesnt-support-property-or-method-append-in-ie9%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
e OICGER 6,tmgoe7K,UTWj mVUxp2Aq1K3vZxyja4S42RLgrqaELsfxbeFOcNFjINbClcDRSHVQ3C7r0
this might help... developer.mozilla.org/en-US/docs/Web/API/ParentNode/…
– pramesh
Dec 31 '18 at 19:09