Zusammenfassung der Vue-Grundkenntnisse: Vue-Komponentenentwicklung-View.js-php.cn

Dieser Artikel bringt Ihnen Informationen zu vueEr stellt hauptsächlich Probleme im Zusammenhang mit der Entwicklung von Vue-Komponenten vor. Wir können eine unabhängige und wiederverwendbare kleine Komponente entwickeln, um unsere zu erstellen. Werfen wir einen Blick auf die folgenden Anwendungskomponenten es wird für alle hilfreich sein.

Zusammenfassung der Vue-Grundkenntnisse: Vue-Komponentenentwicklung

【Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend】

1. Funktionale Programmierung

Funktionale Programmierung ist eine Programmiermethode, die Computeroperationen integriert werden als Berechnungen von Funktionen behandelt. Die wichtigste Grundlage der funktionalen Programmiersprache ist die Lambda-Kalküle, und Lambda-Kalkülfunktionen können Funktionen als Eingabe (Parameter) und Ausgabe (Rückgabewerte) akzeptieren.

Im Vergleich zur imperativen Programmierung betont die funktionale Programmierung, dass die Berechnung von Funktionen wichtiger ist als die Ausführung von Anweisungen.

Im Vergleich zur prozeduralen Programmierung kann die Berechnung von Funktionen in der funktionalen Programmierung jederzeit aufgerufen werden.

Die Filterfunktion filtert automatisch alle Elemente des Objekts und gibt „true“ zurück, bevor es im angegebenen Objekt gespeichert wird.

Die Funktion „Reduzieren“ fasst alle Elemente innerhalb des Arrays zusammen -model

Vue verwendet häufig Formularelemente wie und

. Die Datenbindung dieser Elemente durch Vue unterscheidet sich etwas von der jQuery, die wir zuvor häufig verwendet haben. Vue verwendet das V-Modell, um die bidirektionale Bindung dieser Tag-Daten zu implementieren. Es wählt automatisch die richtige Methode zum Aktualisieren von Elementen basierend auf dem Steuerelementtyp aus. <p></p>
<h3 id="2%E3%80%81%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B">1. V-Modell-Zwei-Wege-Bindung <strong></strong><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  {{totalPrice()}}
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好'
    },
    methods :{
      totalPrice(){
        const nums = [10,9,21,16,7]
        let total = nums.filter(x => x<10).map(x => x*2).reduce((pre,n)=>pre+n);
        console.log(total)
        return total
      }
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
</h3>Das Implementierungsprinzip der dynamischen Zwei-Wege-Bindung des V-Modells besteht im Wesentlichen aus zwei Operationen: <h2 id="%E4%BA%8C%E3%80%81v-model"></h2> (1) V-Bind bindet ein Wertattribut <p></p> (2 ) Die v-on-Anweisung bindet das Eingabeereignis an das aktuelle Element<h3 id="1%E3%80%81v-model%E5%8F%8C%E5%90%91%E7%BB%91%E5%AE%9A">
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><input type="text" v-model="message"></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<strong>2. Verwenden Sie das V-Modell in Kombination mit dem Radio</strong>
</h3>
<p></p>
<p>3. Verwenden Sie das V-Modell in Kombination mit dem CheckBox-Optionsfeld</p>
<p></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  
  <input type="text" :value="message" @input="message = $event.target.value">
  {{message}}
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '哪吒'
    },
    methods: {
      valueChange(event){
        this.message = event.target.value;
      }
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div> <h3 id="2%E3%80%81v-model%E5%92%8Cradio%E7%BB%93%E5%90%88%E4%BD%BF%E7%94%A8"></h3>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/620f98adb6ef2848f53c3da086068630-0.png"> 4. Verwenden Sie das V-Modell in Kombination mit der CheckBox-Mehrfachauswahlbox. </p>
<h3 id="3%E3%80%81v-model%E5%92%8CCheckBox%E5%8D%95%E9%80%89%E6%A1%86%E7%BB%93%E5%90%88%E4%BD%BF%E7%94%A8"><strong></strong></h3>5. Verwenden Sie das V-Modell in Kombination mit Select <p></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  <label for="male">
    
    <input type="radio"id="male" value="男" v-model="sex">男
    <input type="radio"id="female" value="女" v-model="sex">女
  </label>
  <h3>您选择的是：{{sex}}</h3>
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好',
      sex: '女'
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<img alt="" src="https://img.php.cn/upload/article/000/000/067/f9c4dc2b9423c9d9df6629f78b5568e1-1.png"><h3 id="4%E3%80%81v-model%E5%92%8CCheckBox%E5%A4%9A%E9%80%89%E6%A1%86%E7%BB%93%E5%90%88%E4%BD%BF%E7%94%A8">
<strong></strong> 7. Verwendung des V-Modell-Modifikators </h3>
<p></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  
  <label for="license">
    <input type="checkbox"id="license" v-model="isAgree">同意协议
  </label>
  <h3>您选择的是：{{isAgree}}</h3>
  <button :disabled="!isAgree">下一步</button>
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好',
      isAgree: false
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<img alt="" src="https://img.php.cn/upload/article/000/000/067/f9c4dc2b9423c9d9df6629f78b5568e1-2.png"> 3. Komponentenentwicklung <h3 id="5%E3%80%81v-model%E7%BB%93%E5%90%88select%E4%BD%BF%E7%94%A8"> Komponenten sind eine wichtige Idee in Vue.js <strong></strong>
</h3> Sie bieten eine Abstraktion, die es uns ermöglicht, eine unabhängige und wiederverwendbare Lösung zu entwickeln kleine Komponente Zum Erstellen unserer Anwendungskomponenten<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/f9c4dc2b9423c9d9df6629f78b5568e1-3.png">kann HTML-Elemente erweitern und wiederverwendbaren Code kapseln</p>
<h3 id="6%E3%80%81v-for%E5%80%BC%E7%BB%91%E5%AE%9A">Das Komponentensystem ermöglicht es uns, unabhängige wiederverwendbare kleine Komponenten zu verwenden, um große Anwendungen zu erstellen. Die Schnittstelle fast jeder Art von Anwendung kann in einen Komponentenbaum abstrahiert werden </h3>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/f9c4dc2b9423c9d9df6629f78b5568e1-4.png">Anwendung komponentenbasierter Ideen </p>
<h3 id="7%E3%80%81v-model%E4%BF%AE%E9%A5%B0%E7%AC%A6%E7%9A%84%E4%BD%BF%E7%94%A8"><strong>Bei der komponentenbasierten Idee müssen wir sie in der zukünftigen Entwicklung voll ausnutzen</strong></h3>Teilen Sie die Seite so weit wie möglich in kleine, wiederverwendbare Komponenten auf<h2 id="%E4%B8%89%E3%80%81%E7%BB%84%E4%BB%B6%E5%8C%96%E5%BC%80%E5%8F%91"></h2> Das macht unseren Code einfacher zu organisieren und zu verwalten und verfügt über eine starke Skalierbarkeit<p></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  
  <input type="checkbox" value="比比东" v-model="girls">比比东
  <input type="checkbox" value="千仞雪" v-model="girls">千仞雪
  <input type="checkbox" value="美杜莎" v-model="girls">美杜莎
  <input type="checkbox" value="云韵" v-model="girls">云韵
  <input type="checkbox" value="雅妃" v-model="girls">雅妃
  <h3>您选择的是：{{girls}}</h3>
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好',
      girls: []
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<ul>
<li><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  
  <select name="abc" v-model="girl">
    <option value="云韵">云韵</option>
    <option value="比比东">比比东</option>
    <option value="雅妃">雅妃</option>
    <option value="千仞雪">千仞雪</option>
    <option value="美杜莎">美杜莎</option>
  </select>
  <h3>您的选择是：{{girl}}</h3>
</div>
 
<script src="../js/vue.js"></script>
<script>
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好',
      girl: '云韵'
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div></li>
<li>
<li>3<h3 id="4%E3%80%81%E7%BB%84%E4%BB%B6%E5%8C%96%E8%AF%AD%E6%B3%95%E7%B3%96%E5%86%99%E6%B3%95"><strong>4、组件化语法糖写法</strong></h3>
<p>vue为了简化注册组件的过程，提供了语法糖的写法，主要是省去了调用Vue.extend()的步骤，直接使用一个对象替代。</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  <my-cpn></my-cpn>
</div>
 
<script src="../js/vue.js"></script>
<script>
  //注册组件语法糖写法
  Vue.component('my-cpn',{
    template: `
      <div>
        <h2>我是标题</h2>
        <p>我是CSDN哪吒</p>
      </div>
      `
  })
 
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好'
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<h3 id="5%E3%80%81%E7%BB%84%E4%BB%B6%E6%A8%A1%E6%9D%BF%E6%8A%BD%E7%A6%BB%E5%86%99%E6%B3%95">5、组件模板抽离写法</h3>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
 
<div id="app">
  <cpn></cpn>
  <cpn></cpn>
  <cpn></cpn>
</div>
 







 

<template id="cpn">
  <div>
    <h2>我是标题</h2>
    <p>我是CSDN哪吒</p>
  </div>
</template>
 
<script src="../js/vue.js"></script>
<script>
 
  // 1.注册一个全局组件
  Vue.component('cpn', {
    template: '#cpn'
  })
 
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好啊'
    }
  })
</script>
 
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<h2 id="%E5%9B%9B%E3%80%81%E7%BB%84%E4%BB%B6%E5%8F%AF%E4%BB%A5%E8%AE%BF%E9%97%AEVue%E5%AE%9E%E4%BE%8B%E6%95%B0%E6%8D%AE%E5%90%97%EF%BC%9F"><strong>四、组件可以访问Vue实例数据吗？</strong></h2>
<h3 id="1%E3%80%81%E7%AE%80%E4%BB%8B"><strong>1、简介</strong></h3>
<p>实验发现，组件不能访问Vue实例数据，而且即便可以访问，如果将所有的数据都放在Vue实例中，Vue实例就会变得非常臃肿。</p>
<p>Vue组件应该有自己保存数据的地方。</p>
<p>组件自己的数据存放在哪里？</p>
<ul>
<li>组件对象也有一个data属性（也有method等属性）；</li>
<li>只是这个data属性必须是一个函数；</li>
<li>而且这个函数返回一个对象，对象内部保存着数据；</li>
</ul>
<h3><strong>2、代码实例</strong></h3>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
 
<div id="app">
  <cpn></cpn>
</div>
<template id="cpn">
  <div>
    <h2>{{title}}</h2>
    <p>我是热门</p>
  </div>
</template>
 
<script src="../js/vue.js"></script>
<script>
 
  // 1.注册一个全局组件
  Vue.component('cpn', {
    template: '#cpn',
    data() {
      return {
        title: '哪吒必胜'
      }
    }
  })
 
  const app = new Vue({
    el: '#app',
    data: {
      message: '你好',
      // title: '我是标题'
    }
  })
</script>
 
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<h3 id="3%E3%80%81%E6%95%88%E6%9E%9C%E5%B1%95%E7%A4%BA%C2%A0">3、效果展示 </h3>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/0b258ebf2a010865b34556821bc54828-7.png"></p>
<h2 id="%E4%BA%94%E3%80%81%E7%88%B6%E5%AD%90%E7%BB%84%E4%BB%B6%E9%80%9A%E4%BF%A1">五、父子组件通信</h2>
<h3 id="1%E3%80%81%E7%88%B6%E5%AD%90%E7%BB%84%E4%BB%B6%E9%80%9A%E4%BF%A1%E7%AE%80%E4%BB%8B"><strong>1、父子组件通信简介</strong></h3>
<p>在开发中，往往一些数据确实需要从上层传递到下层：</p>
<p>比如在一个页面中，我们从服务器请求到了很多的数据。</p>
<p>其中一部分数据，并非是我们整个页面的大组件来展示的，而是需要下面的子组件进行展示。</p>
<p>这个时候，并不会让子组件再次发送一个网络请求，而是直接让大组件(父组件)将数据传递给小组件(子组件)。</p>
<p>如何进行父子组件间的通信呢？Vue官方提到：</p>
<p>通过props向子组件传递数据</p>
<p>通过事件向父组件发送消息</p>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/0b258ebf2a010865b34556821bc54828-8.png"></p>
<p>在组件中，使用选项props来声明需要从父级接收到的数据。</p>
<p>props的值有两种方式：</p>
<p>方式一：字符串数组，数组中的字符串就是传递时的名称。</p>
<p>方式二：对象，对象可以设置传递时的类型，也可以设置默认值等。</p>
<h3 id="2%E3%80%81%E7%88%B6%E4%BC%A0%E5%AD%90%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B">2、父传子代码实例</h3>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
 
<div id="app">
  
  
 
  <cpn :cmessage="message" :cgirls="girls"></cpn>
</div>
 
<template id="cpn">
  <div>
    <ul>
      <li v-for="item in cgirls">{{item}}</li>
    </ul>
    <h2>{{cmessage}}</h2>
  </div>
</template>
 
<script src="../js/vue.js"></script>
<script>
  // 父传子: props
  const cpn = {
    template: '#cpn',
    // props: ['cgirls', 'cmessage'],
    props: {
      // 1.类型限制
      // cgirls: Array,
      // cmessage: String,
 
      // 2.提供一些默认值, 以及必传值
      cmessage: {
        type: String,
        default: 'aaaaaaaa',
        required: true
      },
      // 类型是对象或者数组时, 默认值必须是一个函数
      cgirls: {
        type: Array,
        default() {
          return []
        }
      }
    },
    data() {
      return {}
    },
    methods: {
 
    }
  }
 
  const app = new Vue({
    el: '#app',
    data: {
      message: 'CSDN哪吒',
      girls: ['云韵', '比比东', '雅妃']
    },
    components: {
      cpn
    }
  })
</script>
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<h3 id="3%E3%80%81%E7%88%B6%E4%BC%A0%E5%AD%90%E6%95%88%E6%9E%9C%E5%B1%95%E7%A4%BA%C2%A0"><strong>3、父传子效果展示 </strong></h3>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/c0432c9e0b10c8fd8712f21bdb5af889-9.png"></p>
<h3 id="4%E3%80%81props%E4%B8%AD%E7%9A%84%E9%A9%BC%E5%B3%B0%E6%A0%87%E8%AF%86"><strong>4、props中的驼峰标识</strong></h3>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
 
<div id="app">
  <cpn :c-info="info" :child-my-message="message" v-bind:class></cpn>
</div>
 
<template id="cpn">
  <div>
    <h2>{{cInfo}}</h2>
    <h2>{{childMyMessage}}</h2>
  </div>
</template>
 
<script src="../js/vue.js"></script>
<script>
  const cpn = {
    template: '#cpn',
    props: {
      cInfo: {
        type: Object,
        default() {
          return {}
        }
      },
      childMyMessage: {
        type: String,
        default: ''
      }
    }
  }
 
  const app = new Vue({
    el: '#app',
    data: {
      info: {
        name: '哪吒',
        age: 18,
        height: 1.88
      },
      message: 'csdn博客专家'
    },
    components: {
      cpn
    }
  })
</script>
 
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<p>效果展示 </p>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/c0432c9e0b10c8fd8712f21bdb5af889-10.png"></p>
<h3 id="5%E3%80%81%E5%AD%90%E4%BC%A0%E7%88%B6%EF%BC%88%E8%87%AA%E5%AE%9A%E4%B9%89%E4%BA%8B%E4%BB%B6%E6%96%B9%E5%BC%8F%EF%BC%89"><strong>5、子传父（自定义事件方式）</strong></h3>
<p>自定义事件方式完成子传父。</p>
<p>什么时候需要自定义事件呢？</p>
<p>当子组件需要向父组件传递数据时，就要用到自定义事件了。</p>
<p>我们之前学习的v-on不仅仅可以用于监听DOM事件，也可以用于组件间的自定义事件。</p>
<p>自定义事件的流程：</p>
<ul style="list-style-type: disc;">
<li><p>在子组件中，通过$emit()来触发事件。</p></li>
<li><p>在父组件中，通过v-on来监听子组件事件。</p></li>
</ul>
<h3 id="6%E3%80%81%E5%AD%90%E4%BC%A0%E7%88%B6%E4%BB%A3%E7%A0%81%E5%AE%9E%E4%BE%8B"><strong>6、子传父代码实例</strong></h3>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
 

<div id="app">
  <cpn @item-click="cpnClick"></cpn>
</div>
 

<template id="cpn">
  <div>
    <button v-for="item in categories"
            @click="btnClick(item)">
      {{item.name}}
    </button>
  </div>
</template>
 
<script src="../js/vue.js"></script>
<script>
 
  // 1.子组件
  const cpn = {
    template: '#cpn',
    data() {
      return {
        categories: [
          {id: '1', name: '云韵'},
          {id: '2', name: '比比东'},
          {id: '3', name: '雅妃'},
          {id: '4', name: '纳兰嫣然'},
        ]
      }
    },
    methods: {
      btnClick(item) {
        // 发射事件: 自定义事件
        this.$emit('item-click', item)
      }
    }
  }
 
  // 2.父组件
  const app = new Vue({
    el: '#app',
    data: {
      message: 'csdn哪吒'
    },
    components: {
      cpn
    },
    methods: {
      cpnClick(item) {
        console.log('cpnClick', item);
      }
    }
  })
</script>
 
</body>
</html></pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<h3 id="7%E3%80%81%E5%AD%90%E4%BC%A0%E7%88%B6%E6%95%88%E6%9E%9C%E5%B1%95%E7%A4%BA">7、子传父效果展示</h3>
<p><img alt="" src="https://img.php.cn/upload/article/000/000/067/c0432c9e0b10c8fd8712f21bdb5af889-11.png"></p>
<p>【相关推荐：<a href="https://www.php.cn/course/list/17.html" target="_blank" textvalue="javascript视频教程">javascript视频教程</a>、<a href="https://www.php.cn/course/list/1.html" target="_blank">web前端</a>】</p>
</li>
</ul><p>Das obige ist der detaillierte Inhalt vonZusammenfassung der Vue-Grundkenntnisse: Vue-Komponentenentwicklung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!</p>                </div>
            </div>
            <div style="height: 25px;">
                                <div class="wzconBq" style="display: inline-flex;">
                    <span>Verwandte Etiketten：</span>
                    <div class="wzcbqd">
                        <a onclick="hits_log(2,'www',this);" href-data="https://www.php.cn/de/search?word=vue" target="_blank">vue</a>                    </div>
                </div>
                                <div style="display: inline-flex;float: right; color:#333333;">Quelle：csdn.net</div>
                            </div>
            <div class="wzconOtherwz">
                                    <a href="https://www.php.cn/de/faq/494788.html" title="Eingehende Analyse der globalen Axios-Konfiguration, der Interceptoren und des domänenübergreifenden Proxy-Proxys (Bild und Text)">
                        <span>Vorheriger Artikel：Eingehende Analyse der globalen Axios-Konfiguration, der Interceptoren und des domänenübergreifenden Proxy-Proxys (Bild und Text)</span>
                    </a>
                                    <a href="https://www.php.cn/de/faq/494790.html"  title="Eine eingehende Analyse der dynamischen Attributbindungsanweisung v-bind von Vue">
                        <span>Nächster Artikel：Eine eingehende Analyse der dynamischen Attributbindungsanweisung v-bind von Vue</span>
                    </a>
                            </div>
            <div class="wzconShengming">
       
                <div class="bzsmdiv">Erklärung dieser Website</div>
                <div>Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn</div>
            </div>
            <ins class="adsbygoogle"
     style="display:block"
     data-ad-format="autorelaxed"
     data-ad-client="ca-pub-5902227090019525"
     data-ad-slot="2507867629"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
            <div class="wzconZzwz">
                <div class="wzconZzwztitle">Neueste Artikel des Autors</div>
                <ul>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796639331.html">Was ist eine NullPointerException und wie behebe ich sie?</a>
                            </div>
                            <div>2024-10-22 09:46:29</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796629482.html">Vom Anfänger zum Programmierer: Ihre Reise beginnt mit C-Grundlagen</a>
                            </div>
                            <div>2024-10-13 13:53:41</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796628545.html">Webentwicklung mit PHP freischalten: Ein Leitfaden für Anfänger</a>
                            </div>
                            <div>2024-10-12 12:15:51</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627928.html">C entmystifizieren: Ein klarer und einfacher Weg für neue Programmierer</a>
                            </div>
                            <div>2024-10-11 22:47:31</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627806.html">Entfalten Sie Ihr Programmierpotenzial: C-Programmierung für absolute Anfänger</a>
                            </div>
                            <div>2024-10-11 19:36:51</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627670.html">Entfesseln Sie Ihren inneren Programmierer: C für absolute Anfänger</a>
                            </div>
                            <div>2024-10-11 15:50:41</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627643.html">Automatisieren Sie Ihr Leben mit C: Skripte und Tools für Anfänger</a>
                            </div>
                            <div>2024-10-11 15:07:41</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627620.html">PHP leicht gemacht: Ihre ersten Schritte in der Webentwicklung</a>
                            </div>
                            <div>2024-10-11 14:21:21</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627574.html">Erstellen Sie alles mit Python: Ein Leitfaden für Anfänger, um Ihrer Kreativität freien Lauf zu lassen</a>
                            </div>
                            <div>2024-10-11 12:59:11</div>
                        </li>
                                            <li>
                            <div class="wzczzwzli">
                                <span class="layui-badge-dots"></span>
                                <a target="_blank" href="https://www.php.cn/de/faq/1796627539.html">Der Schlüssel zum Programmieren: Die Leistungsfähigkeit von Python für Anfänger freischalten</a>
                            </div>
                            <div>2024-10-11 12:17:31</div>
                        </li>
                                    </ul>
            </div>
            <div class="wzconZzwz">
                <div class="wzconZzwztitle">Aktuelle Ausgaben</div>
                <div class="wdsyContent">
                                        <div class="wdsyConDiv flexRow wdsyConDiv1">
                        <div class="wdcdContent flexColumn">
                            <a href="https://www.php.cn/de/wenda/176366.html"  target="_blank" title="Verwenden von Variablen, die in Methoden in Vorlagen definiert sind" class="wdcdcTitle">Verwenden von Variablen, die in Methoden in Vorlagen definiert sind</a>
                            <a href="https://www.php.cn/de/wenda/176366.html" class="wdcdcCons">Dies ist das erste Mal, dass ich Vue verwende (v2, nicht v3) und ich habe versucht, Variab...</a>
                            <div class="wdcdcInfo flexRow">
                                <div class="wdcdcileft">
                                    <span class="wdcdciSpan"> Aus 2024-04-06 18:10:25</span>
                                </div>
                                <div class="wdcdciright flexRow">
                                    <div class="wdcdcirdz flexRow ira">  <b class="wdcdcirdzi"></b>0 </div>
                                    <div class="wdcdcirpl flexRow ira"><b  class="wdcdcirpli"></b>2</div>
                                    <div class="wdcdcirwatch flexRow ira"><b  class="wdcdcirwatchi"></b>513</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="wdsyConLine wdsyConLine2"></div>
                                        <div class="wdsyConDiv flexRow wdsyConDiv1">
                        <div class="wdcdContent flexColumn">
                            <a href="https://www.php.cn/de/wenda/176336.html"  target="_blank" title="Erstellen Sie Benutzer in Vue mit Firebase, keine Anmeldung erforderlich" class="wdcdcTitle">Erstellen Sie Benutzer in Vue mit Firebase, keine Anmeldung erforderlich</a>
                            <a href="https://www.php.cn/de/wenda/176336.html" class="wdcdcCons">Ich habe ein Formular zum Erstellen von Benutzerprofilen erstellt. Aber wann immer ich ein...</a>
                            <div class="wdcdcInfo flexRow">
                                <div class="wdcdcileft">
                                    <span class="wdcdciSpan"> Aus 2024-04-06 14:20:12</span>
                                </div>
                                <div class="wdcdciright flexRow">
                                    <div class="wdcdcirdz flexRow ira">  <b class="wdcdcirdzi"></b>0 </div>
                                    <div class="wdcdcirpl flexRow ira"><b  class="wdcdcirpli"></b>1</div>
                                    <div class="wdcdcirwatch flexRow ira"><b  class="wdcdcirwatchi"></b>514</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="wdsyConLine wdsyConLine2"></div>
                                        <div class="wdsyConDiv flexRow wdsyConDiv1">
                        <div class="wdcdContent flexColumn">
                            <a href="https://www.php.cn/de/wenda/176322.html"  target="_blank" title="Beheben von Problemen beim Produktions-Build von Vue3-Webkomponenten" class="wdcdcTitle">Beheben von Problemen beim Produktions-Build von Vue3-Webkomponenten</a>
                            <a href="https://www.php.cn/de/wenda/176322.html" class="wdcdcCons">Ich versuche, meine vue2web-Komponenten auf vue3 zu migrieren, obwohl das Problem auftritt...</a>
                            <div class="wdcdcInfo flexRow">
                                <div class="wdcdcileft">
                                    <span class="wdcdciSpan"> Aus 2024-04-06 12:43:37</span>
                                </div>
                                <div class="wdcdciright flexRow">
                                    <div class="wdcdcirdz flexRow ira">  <b class="wdcdcirdzi"></b>0 </div>
                                    <div class="wdcdcirpl flexRow ira"><b  class="wdcdcirpli"></b>1</div>
                                    <div class="wdcdcirwatch flexRow ira"><b  class="wdcdcirwatchi"></b>473</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="wdsyConLine wdsyConLine2"></div>
                                        <div class="wdsyConDiv flexRow wdsyConDiv1">
                        <div class="wdcdContent flexColumn">
                            <a href="https://www.php.cn/de/wenda/176315.html"  target="_blank" title="vue vee-validate erfasst das Problem der Datumsauswahlauswahl" class="wdcdcTitle">vue vee-validate erfasst das Problem der Datumsauswahlauswahl</a>
                            <a href="https://www.php.cn/de/wenda/176315.html" class="wdcdcCons">Die V-Modell-Bindung in meinem Datepicker-Feld funktioniert nicht richtig. Wenn Sie eine A...</a>
                            <div class="wdcdcInfo flexRow">
                                <div class="wdcdcileft">
                                    <span class="wdcdciSpan"> Aus 2024-04-06 11:38:56</span>
                                </div>
                                <div class="wdcdciright flexRow">
                                    <div class="wdcdcirdz flexRow ira">  <b class="wdcdcirdzi"></b>0 </div>
                                    <div class="wdcdcirpl flexRow ira"><b  class="wdcdcirpli"></b>1</div>
                                    <div class="wdcdcirwatch flexRow ira"><b  class="wdcdcirwatchi"></b>510</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="wdsyConLine wdsyConLine2"></div>
                                        <div class="wdsyConDiv flexRow wdsyConDiv1">
                        <div class="wdcdContent flexColumn">
                            <a href="https://www.php.cn/de/wenda/176314.html"  target="_blank" title="Gibt es eine Möglichkeit, die Routenstütze in Vue festzulegen?" class="wdcdcTitle">Gibt es eine Möglichkeit, die Routenstütze in Vue festzulegen?</a>
                            <a href="https://www.php.cn/de/wenda/176314.html" class="wdcdcCons">Ich möchte zu einer bestimmten Registerkarte auf der Seite this.$router.push({name:"A...</a>
                            <div class="wdcdcInfo flexRow">
                                <div class="wdcdcileft">
                                    <span class="wdcdciSpan"> Aus 2024-04-06 11:35:59</span>
                                </div>
                                <div class="wdcdciright flexRow">
                                    <div class="wdcdcirdz flexRow ira">  <b class="wdcdcirdzi"></b>0 </div>
                                    <div class="wdcdcirpl flexRow ira"><b  class="wdcdcirpli"></b>1</div>
                                    <div class="wdcdcirwatch flexRow ira"><b  class="wdcdcirwatchi"></b>456</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="wdsyConLine wdsyConLine2"></div>
                                    </div>
            </div>

<div class="wzconZt" >
                <div class="wzczt-title">
                    <div>verwandte Themen</div>
                    <a href="https://www.php.cn/de/faq/zt" target="_blank">Mehr>
                    </a>
                </div>
                <div class="wzcttlist">
                    <ul>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vuefzj"><img src="https://img.php.cn/upload/subject/202407/22/2024072214322017503.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Die übergeordnete Vue-Komponente ruft die Methode der untergeordneten Komponente auf" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vuefzj" class="title-a-spanl" title="Die übergeordnete Vue-Komponente ruft die Methode der untergeordneten Komponente auf"><span>Die übergeordnete Vue-Komponente ruft die Methode der untergeordneten Komponente auf</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vuevif"><img src="https://img.php.cn/upload/subject/202407/22/2024072214321856034.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="vue v-wenn" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vuevif" class="title-a-spanl" title="vue v-wenn"><span>vue v-wenn</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vueqb"><img src="https://img.php.cn/upload/subject/202407/22/2024072214321663953.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Der Unterschied zwischen vue2.0 und 3.0" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vueqb" class="title-a-spanl" title="Der Unterschied zwischen vue2.0 und 3.0"><span>Der Unterschied zwischen vue2.0 und 3.0</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vuezjcz"><img src="https://img.php.cn/upload/subject/202407/22/2024072214321115425.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="So übergeben Sie einen Wert an die Vue-Komponente" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vuezjcz" class="title-a-spanl" title="So übergeben Sie einen Wert an die Vue-Komponente"><span>So übergeben Sie einen Wert an die Vue-Komponente</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vueshedqb"><img src="https://img.php.cn/upload/subject/202407/22/2024072214300227606.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Der Unterschied zwischen vue3.0 und 2.0" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vueshedqb" class="title-a-spanl" title="Der Unterschied zwischen vue3.0 und 2.0"><span>Der Unterschied zwischen vue3.0 und 2.0</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vuecyzl"><img src="https://img.php.cn/upload/subject/202407/22/2024072214262495693.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Vue allgemeine Anweisungen" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vuecyzl" class="title-a-spanl" title="Vue allgemeine Anweisungen"><span>Vue allgemeine Anweisungen</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/vuecyzlynx"><img src="https://img.php.cn/upload/subject/202407/22/2024072214194365070.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Was sind die am häufigsten verwendeten Anweisungen in Vue?" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/vuecyzlynx" class="title-a-spanl" title="Was sind die am häufigsten verwendeten Anweisungen in Vue?"><span>Was sind die am häufigsten verwendeten Anweisungen in Vue?</span> </a>
                        </li>
                                                <li class="ul-li">
                            <a target="_blank" href="https://www.php.cn/de/faq/mpvuehvueqb"><img src="https://img.php.cn/upload/subject/202407/22/2024072213475148622.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="Der Unterschied zwischen mpvue und vue" /> </a>
                            <a target="_blank" href="https://www.php.cn/de/faq/mpvuehvueqb" class="title-a-spanl" title="Der Unterschied zwischen mpvue und vue"><span>Der Unterschied zwischen mpvue und vue</span> </a>
                        </li>
                                            </ul>
                </div>
            </div>
        </div>
    </div>

<div class="phpwzright">
    <ins class="adsbygoogle"
        style="display:block"
        data-ad-client="ca-pub-5902227090019525"
        data-ad-slot="3653428331"
        data-ad-format="auto"
        data-full-width-responsive="true"></ins>
    <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
        <div class="wzrOne">
            <div class="wzroTitle">Beliebte Empfehlungen</div>
            <div class="wzroList">
                <ul>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="Wie ruft eine Vue-Unterkomponente die Methode der übergeordneten Komponente auf?" href="https://www.php.cn/de/faq/483395.html">Wie ruft eine Vue-Unterkomponente die Methode der übergeordneten Komponente auf?</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="Wie ruft eine übergeordnete Vue-Komponente die Methode einer untergeordneten Komponente auf?" href="https://www.php.cn/de/faq/483398.html">Wie ruft eine übergeordnete Vue-Komponente die Methode einer untergeordneten Komponente auf?</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="Was ist der Unterschied zwischen vue3.0 und vue2.0?" href="https://www.php.cn/de/faq/464077.html">Was ist der Unterschied zwischen vue3.0 und vue2.0?</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="Was ist .vue?" href="https://www.php.cn/de/faq/465747.html">Was ist .vue?</a>
                                </div>
                            </li>
                                                <li>
                                <div class="wzczzwzli">
                                    <span class="layui-badge-dots wzrolr"></span>
                                    <a style="height: auto;" title="So übergeben Sie einen Wert von der Vue-Unterkomponente an die übergeordnete Komponente" href="https://www.php.cn/de/faq/480569.html">So übergeben Sie einen Wert von der Vue-Unterkomponente an die übergeordnete Komponente</a>
                                </div>
                            </li>
                                    </ul>
            </div>
        </div>
        <script src="https://sw.php.cn/hezuo/cac1399ab368127f9b113b14eb3316d0.js" type="text/javascript"></script>
        <div class="wzrThree">
            <div class="wzrthree-title">
                <div>Beliebte Tutorials</div>
                <a target="_blank" href="https://www.php.cn/de/course.html">Mehr>
                </a>
            </div>
            <div class="wzrthreelist swiper2">
                <div class="wzrthreeTab  swiper-wrapper">
                    <div class="check tabdiv swiper-slide" data-id="one">Verwandte Tutorials <div></div></div>
                    <div class="tabdiv swiper-slide" data-id="two">Beliebte Empfehlungen<div></div></div>
                    <div class="tabdiv swiper-slide" data-id="three">Aktuelle Kurse<div></div></div>
                </div>
                <ul class="one">
                                                <li>
                                <a target="_blank" href="https://www.php.cn/de/course/1292.html" title="Vue2.0+Vue3.0 kompletter Satz Video-Tutorials" class="wzrthreelaimg">
                                    <img src="https://img.php.cn/upload/course/000/000/015/6152aaa027ecd382.jpg" alt="Vue2.0+Vue3.0 kompletter Satz Video-Tutorials"/>
                                </a>
                                <div class="wzrthree-right">
                                    <a target="_blank" title="Vue2.0+Vue3.0 kompletter Satz Video-Tutorials" href="https://www.php.cn/de/course/1292.html">Vue2.0+Vue3.0 kompletter Satz Video-Tutorials</a>
                                    <div class="wzrthreerb">
                                        <div>343608 <b class="kclbcollectb"></b></div>
                                     
                                                                                    <div class="courseICollection" data-id="1292">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                            </div>
                                </div>
                            </li>
                                                <li>
                                <a target="_blank" href="https://www.php.cn/de/course/1317.html" title="Echarts-Vue-Projekt – E-Commerce-Plattform-Datenvisualisierungs-Echtzeitüberwachungssystem" class="wzrthreelaimg">
                                    <img src="https://img.php.cn/upload/course/000/000/015/617b91a1080ed381.jpg" alt="Echarts-Vue-Projekt – E-Commerce-Plattform-Datenvisualisierungs-Echtzeitüberwachungssystem"/>
                                </a>
                                <div class="wzrthree-right">
                                    <a target="_blank" title="Echarts-Vue-Projekt – E-Commerce-Plattform-Datenvisualisierungs-Echtzeitüberwachungssystem" href="https://www.php.cn/de/course/1317.html">Echarts-Vue-Projekt – E-Commerce-Plattform-Datenvisualisierungs-Echtzeitüberwachungssystem</a>
                                    <div class="wzrthreerb">
                                        <div>109893 <b class="kclbcollectb"></b></div>
                                     
                                                                                    <div class="courseICollection" data-id="1317">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                            </div>
                                </div>
                            </li>
                                                <li>
                                <a target="_blank" href="https://www.php.cn/de/course/1324.html" title="Vue in Aktion – erstellen Sie Ihr eigenes Take-Away-System" class="wzrthreelaimg">
                                    <img src="https://img.php.cn/upload/course/000/000/015/618376c1e8751382.jpg" alt="Vue in Aktion – erstellen Sie Ihr eigenes Take-Away-System"/>
                                </a>
                                <div class="wzrthree-right">
                                    <a target="_blank" title="Vue in Aktion – erstellen Sie Ihr eigenes Take-Away-System" href="https://www.php.cn/de/course/1324.html">Vue in Aktion – erstellen Sie Ihr eigenes Take-Away-System</a>
                                    <div class="wzrthreerb">
                                        <div>93467 <b class="kclbcollectb"></b></div>
                                     
                                                                                    <div class="courseICollection" data-id="1324">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                            </div>
                                </div>
                            </li>
                                                <li>
                                <a target="_blank" href="https://www.php.cn/de/course/1325.html" title="webpack+vue – Erstellen Sie ein Front-End-Projekt von Grund auf" class="wzrthreelaimg">
                                    <img src="https://img.php.cn/upload/course/000/000/068/6260f9b9d4650868.png" alt="webpack+vue – Erstellen Sie ein Front-End-Projekt von Grund auf"/>
                                </a>
                                <div class="wzrthree-right">
                                    <a target="_blank" title="webpack+vue – Erstellen Sie ein Front-End-Projekt von Grund auf" href="https://www.php.cn/de/course/1325.html">webpack+vue – Erstellen Sie ein Front-End-Projekt von Grund auf</a>
                                    <div class="wzrthreerb">
                                        <div>52613 <b class="kclbcollectb"></b></div>
                                     
                                                                                    <div class="courseICollection" data-id="1325">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                            </div>
                                </div>
                            </li>
                                                <li>
                                <a target="_blank" href="https://www.php.cn/de/course/1340.html" title="Ein vollständiger Satz praktischer Tutorials zur Vue-Kerntechnologie" class="wzrthreelaimg">
                                    <img src="https://img.php.cn/upload/course/000/000/015/619b35b926ecb146.jpg" alt="Ein vollständiger Satz praktischer Tutorials zur Vue-Kerntechnologie"/>
                                </a>
                                <div class="wzrthree-right">
                                    <a target="_blank" title="Ein vollständiger Satz praktischer Tutorials zur Vue-Kerntechnologie" href="https://www.php.cn/de/course/1340.html">Ein vollständiger Satz praktischer Tutorials zur Vue-Kerntechnologie</a>
                                    <div class="wzrthreerb">
                                        <div>81196 <b class="kclbcollectb"></b></div>
                                     
                                                                                    <div class="courseICollection" data-id="1340">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                            </div>
                                </div>
                            </li>
                                    </ul>
                <ul class="two" style="display: none;">
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/812.html" title="Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)" href="https://www.php.cn/de/course/812.html">Das neueste Video-Tutorial zur Weltpremiere von ThinkPHP 5.1 (60 Tage zum Online-Schulungskurs zum PHP-Experten)</a>
                                <div class="wzrthreerb">
                                    <div >1427643 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="812">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/286.html" title="JAVA-Video-Tutorial für Anfänger" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA-Video-Tutorial für Anfänger"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="JAVA-Video-Tutorial für Anfänger" href="https://www.php.cn/de/course/286.html">JAVA-Video-Tutorial für Anfänger</a>
                                <div class="wzrthreerb">
                                    <div >2579277 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="286">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/504.html" title="Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python" href="https://www.php.cn/de/course/504.html">Das nullbasierte Einführungsvideo-Tutorial von Little Turtle zum Erlernen von Python</a>
                                <div class="wzrthreerb">
                                    <div >510484 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="504">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/901.html" title="Kurze Einführung in die Web-Frontend-Entwicklung" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Kurze Einführung in die Web-Frontend-Entwicklung"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Kurze Einführung in die Web-Frontend-Entwicklung" href="https://www.php.cn/de/course/901.html">Kurze Einführung in die Web-Frontend-Entwicklung</a>
                                <div class="wzrthreerb">
                                    <div >216289 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="901">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/234.html" title="Meistern Sie PS-Video-Tutorials von Grund auf" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="Meistern Sie PS-Video-Tutorials von Grund auf"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Meistern Sie PS-Video-Tutorials von Grund auf" href="https://www.php.cn/de/course/234.html">Meistern Sie PS-Video-Tutorials von Grund auf</a>
                                <div class="wzrthreerb">
                                    <div >899928 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="234">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                    </ul>
                <ul class="three" style="display: none;">
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/1648.html" title="[Web-Frontend] Node.js-Schnellstart" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="[Web-Frontend] Node.js-Schnellstart"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="[Web-Frontend] Node.js-Schnellstart" href="https://www.php.cn/de/course/1648.html">[Web-Frontend] Node.js-Schnellstart</a>
                                <div class="wzrthreerb">
                                    <div >8237 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="1648">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/1647.html" title="Vollständige Sammlung ausländischer Full-Stack-Kurse zur Webentwicklung" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="Vollständige Sammlung ausländischer Full-Stack-Kurse zur Webentwicklung"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Vollständige Sammlung ausländischer Full-Stack-Kurse zur Webentwicklung" href="https://www.php.cn/de/course/1647.html">Vollständige Sammlung ausländischer Full-Stack-Kurse zur Webentwicklung</a>
                                <div class="wzrthreerb">
                                    <div >6569 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="1647">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/1646.html" title="Gehen Sie zur praktischen Anwendung von GraphQL" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Gehen Sie zur praktischen Anwendung von GraphQL"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Gehen Sie zur praktischen Anwendung von GraphQL" href="https://www.php.cn/de/course/1646.html">Gehen Sie zur praktischen Anwendung von GraphQL</a>
                                <div class="wzrthreerb">
                                    <div >5422 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="1646">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/1645.html" title="Der 550-W-Lüftermeister lernt Schritt für Schritt JavaScript von Grund auf" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="Der 550-W-Lüftermeister lernt Schritt für Schritt JavaScript von Grund auf"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Der 550-W-Lüftermeister lernt Schritt für Schritt JavaScript von Grund auf" href="https://www.php.cn/de/course/1645.html">Der 550-W-Lüftermeister lernt Schritt für Schritt JavaScript von Grund auf</a>
                                <div class="wzrthreerb">
                                    <div >747 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="1645">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                            <li>
                            <a target="_blank" href="https://www.php.cn/de/course/1644.html" title="Python-Meister Mosh, ein Anfänger ohne Grundkenntnisse, kann in 6 Stunden loslegen" class="wzrthreelaimg">
                                <img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="Python-Meister Mosh, ein Anfänger ohne Grundkenntnisse, kann in 6 Stunden loslegen"/>
                            </a>
                            <div class="wzrthree-right">
                                <a target="_blank" title="Python-Meister Mosh, ein Anfänger ohne Grundkenntnisse, kann in 6 Stunden loslegen" href="https://www.php.cn/de/course/1644.html">Python-Meister Mosh, ein Anfänger ohne Grundkenntnisse, kann in 6 Stunden loslegen</a>
                                <div class="wzrthreerb">
                                    <div >27712 Lernzeiten</div>
                                                                                <div class="courseICollection" data-id="1644">
                                                <b class="nofollow small-nocollect"></b>
                                            </div>
                                                                        </div>
                            </div>
                        </li>
                                    </ul>
            </div>
            <script>
                var mySwiper = new Swiper('.swiper2', {
                            autoplay: false,//可选选项，自动滑动
                            slidesPerView : 'auto',
                        })
                $('.wzrthreeTab>div').click(function(e){
                    $('.wzrthreeTab>div').removeClass('check')
                    $(this).addClass('check')
                    $('.wzrthreelist>ul').css('display','none')
                    $('.'+e.currentTarget.dataset.id).show()
                })
            </script>
        </div>

<div class="wzrFour">
            <div class="wzrfour-title">
                <div>Neueste Downloads</div>
                <a href="https://www.php.cn/de/xiazai">Mehr>
                </a>
            </div>
                        <script>
                $(document).ready(function(){
                    var sjyx_banSwiper = new Swiper(".sjyx_banSwiperwz",{
                        speed:1000,
                        autoplay:{
                            delay:3500,
                            disableOnInteraction: false,
                        },
                        pagination:{
                            el:'.sjyx_banSwiperwz .swiper-pagination',
                            clickable :false,
                        },
                        loop:true
                    })
                })
            </script>
            <div class="wzrfourList swiper3">
                <div class="wzrfourlTab swiper-wrapper">
                    <div class="check swiper-slide" data-id="onef">Web-Effekte <div></div></div>
                    <div class="swiper-slide" data-id="twof">Quellcode der Website<div></div></div>
                    <div class="swiper-slide" data-id="threef">Website-Materialien<div></div></div>
                    <div class="swiper-slide" data-id="fourf">Frontend-Vorlage<div></div></div>
                </div>
                <ul class="onef">
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="Kontaktcode für das jQuery-Enterprise-Nachrichtenformular" href="https://www.php.cn/de/toolset/js-special-effects/8071">[Formular-Schaltfläche] Kontaktcode für das jQuery-Enterprise-Nachrichtenformular</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="Wiedergabeeffekte für HTML5-MP3-Spieluhren" href="https://www.php.cn/de/toolset/js-special-effects/8070">[Spezialeffekte für Spieler] Wiedergabeeffekte für HTML5-MP3-Spieluhren</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="HTML5 coole Partikelanimations-Navigationsmenü-Spezialeffekte" href="https://www.php.cn/de/toolset/js-special-effects/8069">[Menünavigation] HTML5 coole Partikelanimations-Navigationsmenü-Spezialeffekte</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="Drag-and-Drop-Bearbeitungscode für visuelle jQuery-Formulare" href="https://www.php.cn/de/toolset/js-special-effects/8068">[Formular-Schaltfläche] Drag-and-Drop-Bearbeitungscode für visuelle jQuery-Formulare</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="VUE.JS imitiert den Kugou-Musik-Player-Code" href="https://www.php.cn/de/toolset/js-special-effects/8067">[Spezialeffekte für Spieler] VUE.JS imitiert den Kugou-Musik-Player-Code</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="Klassisches HTML5-Pushing-Box-Spiel" href="https://www.php.cn/de/toolset/js-special-effects/8066">[HTML5-Spezialeffekte] Klassisches HTML5-Pushing-Box-Spiel</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="jQuery-Scrollen zum Hinzufügen oder Reduzieren von Bildeffekten" href="https://www.php.cn/de/toolset/js-special-effects/8065">[Bildspezialeffekte] jQuery-Scrollen zum Hinzufügen oder Reduzieren von Bildeffekten</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a target="_blank"  title="Persönlicher CSS3-Albumcover-Hover-Zoom-Effekt" href="https://www.php.cn/de/toolset/js-special-effects/8064">[Fotoalbumeffekte] Persönlicher CSS3-Albumcover-Hover-Zoom-Effekt</a>
                            </div>
                        </li>
                                    </ul>
                <ul class="twof" style="display:none">
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8328" title="Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen" target="_blank">[Frontend-Vorlage] Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8327" title="Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben" target="_blank">[Frontend-Vorlage] Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8326" title="Web-Vorlage für kreativen Job-Lebenslauf für Designer" target="_blank">[Frontend-Vorlage] Web-Vorlage für kreativen Job-Lebenslauf für Designer</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8325" title="Website-Vorlage eines modernen Ingenieurbauunternehmens" target="_blank">[Frontend-Vorlage] Website-Vorlage eines modernen Ingenieurbauunternehmens</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8324" title="Responsive HTML5-Vorlage für Bildungseinrichtungen" target="_blank">[Frontend-Vorlage] Responsive HTML5-Vorlage für Bildungseinrichtungen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8323" title="Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren" target="_blank">[Frontend-Vorlage] Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8322" title="IT-Technologie löst Website-Vorlage für Internetunternehmen" target="_blank">[Frontend-Vorlage] IT-Technologie löst Website-Vorlage für Internetunternehmen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8321" title="Website-Vorlage für Devisenhandelsdienste im violetten Stil" target="_blank">[Frontend-Vorlage] Website-Vorlage für Devisenhandelsdienste im violetten Stil</a>
                            </div>
                        </li>
                                    </ul>
                <ul class="threef" style="display:none">
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3078"  target="_blank"  title="可爱的夏天元素矢量素材(EPS+PNG)">[PNG material] 可爱的夏天元素矢量素材(EPS+PNG)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3077"  target="_blank"  title="四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)">[PNG material] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3076"  target="_blank"  title="唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)">[Banner image] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3075"  target="_blank"  title="金色的毕业帽矢量素材(EPS+PNG)">[PNG material] 金色的毕业帽矢量素材(EPS+PNG)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3074"  target="_blank"  title="黑白风格的山脉图标矢量素材(EPS+PNG)">[PNG material] 黑白风格的山脉图标矢量素材(EPS+PNG)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3073"  target="_blank"  title="不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)">[PNG material] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3072"  target="_blank"  title="扁平风格的植树节banner矢量素材(AI+EPS)">[Banner image] 扁平风格的植树节banner矢量素材(AI+EPS)</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-materials/3071"  target="_blank"  title="九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)">[PNG material] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)</a>
                            </div>
                        </li>
                                    </ul>
                <ul class="fourf" style="display:none">
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8328"  target="_blank" title="Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen">[Frontend-Vorlage] Website-Vorlage für Reinigungs- und Reparaturdienste für Inneneinrichtungen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8327"  target="_blank" title="Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben">[Frontend-Vorlage] Persönliche Lebenslauf-Leitfaden-Seitenvorlage in frischen Farben</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8326"  target="_blank" title="Web-Vorlage für kreativen Job-Lebenslauf für Designer">[Frontend-Vorlage] Web-Vorlage für kreativen Job-Lebenslauf für Designer</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8325"  target="_blank" title="Website-Vorlage eines modernen Ingenieurbauunternehmens">[Frontend-Vorlage] Website-Vorlage eines modernen Ingenieurbauunternehmens</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8324"  target="_blank" title="Responsive HTML5-Vorlage für Bildungseinrichtungen">[Frontend-Vorlage] Responsive HTML5-Vorlage für Bildungseinrichtungen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8323"  target="_blank" title="Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren">[Frontend-Vorlage] Vorlage für die Website eines Online-E-Book-Shops für Einkaufszentren</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8322"  target="_blank" title="IT-Technologie löst Website-Vorlage für Internetunternehmen">[Frontend-Vorlage] IT-Technologie löst Website-Vorlage für Internetunternehmen</a>
                            </div>
                        </li>
                                            <li>
                            <div class="wzrfourli">
                                <span class="layui-badge-dots wzrflr"></span>
                                <a href="https://www.php.cn/de/toolset/website-source-code/8321"  target="_blank" title="Website-Vorlage für Devisenhandelsdienste im violetten Stil">[Frontend-Vorlage] Website-Vorlage für Devisenhandelsdienste im violetten Stil</a>
                            </div>
                        </li>
                                    </ul>
            </div>
            <script>
                var mySwiper = new Swiper('.swiper3', {
                            autoplay: false,//可选选项，自动滑动
                            slidesPerView : 'auto',
                        })
                $('.wzrfourlTab>div').click(function(e){
                    $('.wzrfourlTab>div').removeClass('check')
                    $(this).addClass('check')
                    $('.wzrfourList>ul').css('display','none')
                    $('.'+e.currentTarget.dataset.id).show()
                })
            </script>
        </div>
    </div>
</div>
<footer>
    <div class="footer">
        <div class="footertop">
            <img src="/static/imghw/logo.png" alt="">
            <p>Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！</p>
        </div>
        <div class="footermid">
            <a href="https://www.php.cn/de/about/us.html">Über uns</a>
            <a href="https://www.php.cn/de/about/disclaimer.html">Haftungsausschluss</a>
            <a href="https://www.php.cn/de/update/article_0_1.html">Sitemap</a>
        </div>
        <div class="footerbottom">
            <p>
                © php.cn All rights reserved
            </p>
        </div>
    </div>
</footer>

<input type="hidden" id="verifycode" value="/captcha.html">
<script>layui.use(['element', 'carousel'], function () {var element = layui.element;$ = layui.jquery;var carousel = layui.carousel;carousel.render({elem: '#test1', width: '100%', height: '330px', arrow: 'always'});$.getScript('/static/js/jquery.lazyload.min.js', function () {$("img").lazyload({placeholder: "/static/images/load.jpg", effect: "fadeIn", threshold: 200, skip_invisible: false});});});</script>

<script>
  var _paq = window._paq = window._paq || [];
  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
  _paq.push(['trackPageView']);
  _paq.push(['enableLinkTracking']);
  (function() {
    var u="https://tongji.php.cn/";
    _paq.push(['setTrackerUrl', u+'matomo.php']);
    _paq.push(['setSiteId', '9']);
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
  })();
</script>

</body>
</html>